vue.jsの入力要素のフォーカスを設定する

Question

Vue.jsで入力要素のフォーカスを設定しようとしています。私はオンラインで助けを見つけましたが、説明のどれも私のために働いていませんでした。

は、ここに私のコードです：私はフォーカスをターゲットとしたオンライン見つけることができる何のためthis.$$.nameInput.focus();とthis.$els.nameInput.focus();を試してみました

<template> 
    <form method="post" action="" v-on:submit.prevent="search"> 
     <input type="text" placeholder="Person name" required v-model="name" v-el="nameInput" /> 
     <input type="text" placeholder="Company" required v-model="company" v-el="domainInput" /> 
     <input type="submit" value="Search" class="btn show-m" /> 
    </form> 
</template> 

<script> 
export default { 
    data() { 
     return { 
      contacts: [], 
      name: null, 
      company: null 
     } 
    }, 
    ready: { 
     // I tried the following : 
     this.$$.nameInput.focus(); 
     this.$els.nameInput.focus(); 
     // None of them worked ! 
    } 
    methods: { 
     search: function (event) { 
      // ... 

      // I also would like to give the focus here, once the form has been submitted. 
      // And here also, this.$$ and this.$els doesn't work 
     }, 
    } 
} 
</script> 

が、this.$$は未定義であり、this.$elsは空です。それは助けることができるならば、私はvue.js v1.0.15に

を使用してい

はあなたの助けをいただき、ありがとうございます。

Answer 1

いくつか問題があります。まず

、V-EL Sは次のように定義されています。

<input v-el:input-element/> 

は、それはコード内のキャメルケースに変数を有効にします。あなたは、この奇妙な機能hereの詳細を読むことができます。

それ以外の場合は、this.$els.inputElementから変数にアクセスできるはずです。あなたが気にするのは、その要素を定義しているコンポーネント（またはそこに定義している場合はメインアプリケーション自体）にのみ表示されます。

第二に、私のマシンでは、自動フォーカスがFirefox（43.0.4）で動作していないようです。すべてがChromeでうまく動作し、期待どおりのフォーカスが得られます。

Answer 2

vue 2.xでは、ディレクティブで解決できます。 functionningの

奇妙だ

<input v-focus>