Vue.jsでrefを動的に作成できません

Question

私はリストをレンダリングし、その中のサブリストをレンダリングしています。私はlist-{id}のような名前になる私の内側のリストへの参照を持っていたい。しかし、私はこれを達成することができません。私は価値が評価されていない何らかの理由だと思う

$vm0.$refs 
Object {getScrollableRef(company.id): Array(13)} 

：

<ul class="scrollable-list" ref="getScrollableRef(company.id)"> 
    <li v-for="operation in getOperations(company.id)"> 
    {{company.name}} 
    </li> 
</ul> 

私は$refsオブジェクトを調べる：ここ

は、コードスニペットです。誰もこれに直面していますか？

編集：私はあなたの例では、この問題https://github.com/egoist/vue-mugen-scroll/issues/14

Answer 1

を解決しようとしています、あなたはrefは文字通り"getSchoolableRef(componany.id)"命名されるように指定されています。そのため、$refsオブジェクトにはgetScrollableRef(company.id)プロパティが含まれ、その値として13要素の配列が含まれています。

あなたがrefの名前としてgetSchoolableRefメソッドの結果を使用したい場合は、あなたがv-bindや速記コロンを使用することができます。

<ul class="scrollable-list" :ref="getScrollableRef(company.id)"> 

あなたが述べたように、$refsは、反応性および結合を変更しないでコンポーネントが初期化された後の値は、$refsのプロパティ名を更新しません。ただし、コンポーネントが初期化されるときに、refの名前を動的に設定できます。