[解決済み] vue.jsでdynamic refを追加する方法は？

質問

私は、いくつかの動的な <input> 要素があります。私は ref プロパティを追加する必要があります。どのようにvueでこれを行うには？

<div v-for="(result, index) in data" :key="index">
    <input type="text" type="file" ref="element" />
</div>

どのように ref もし result.id が存在する

どのように解決するのですか？

単純に v-バインド のように :ref="'element' + result.id" または ref="`element${result.id}`" .

チェック ここで操作する .

new Vue({
  el: '#app',
  data: {
    data: [{id: 1}, {id: 2}, {id: 3}],
  },
  mounted() {
    console.log(this.$refs);
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>

<div id="app">
<div v-for="(result, index) in data" :key="index">
    <input type="text" type="file" :ref="'element' + result.id" />
</div>
</div>

編集しました。 Vamsiさんの編集のおかげで、私は index を result.id

8/28に編集しました。 grokpotさんのおかげで、Templateリテラルで動くサンプルを追加しました。