無法在Vue.js中動態創建ref

我正在渲染一個列表，然後是其中的一個子列表。我想有一個名爲list-{id}的內部列表。但是，我無法做到這一點。無法在Vue.js中動態創建ref

這裏是代碼片段：

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

當我檢查$refs對象：

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

我認爲，由於某些原因，價值不被評估。有沒有人遇到過這個？

編輯：我試圖解決這個問題https://github.com/egoist/vue-mugen-scroll/issues/14

來源

2017-05-30 aks

在你的榜樣，您指定的ref應該從字面上被命名爲"getSchoolableRef(componany.id)"。這就是爲什麼$refs對象包含一個具有13個元素數組作爲其值的getScrollableRef(company.id)屬性。

如果你想使用getSchoolableRef法作爲ref名的結果，你可以使用v-bind或簡寫冒號：

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

至於你提到的$refs是不是反應並改變綁定值在組件初始化後不會更新$refs中的屬性名稱。但是，組件初始化時可以動態設置ref的名稱。

來源

2017-05-30 17:42:10 thanksd

它在這裏說，我們不應該試圖綁定參考。它是否正確？ https://vuejs.org/v2/api/#ref – aks

好的。我會更新答案。這就是說'$ refs'沒有反應，如果你改變了限制值的更新，它將不會更新。但是，我沒有看到使用'v-bind'初始化ref名稱的問題。 – thanksd

無法在Vue.js中動態創建ref

回答

相關問題