VueJS使用v型變量作爲屬性值

Question

我有一個迭代循環的對象的陣列然後在這裏呈現一個html li項

<li class="block" v-for="(section, key) in sectionDetails"> 
    <a href="#" tabindex="{{ key }}">Item {{ key }}</a> 
</li> 

問題上使用v-for是key在tabindex屬性是不呈現，呈現的是{{ key }}。

我如何獲得key的值用於tabindex？我也試過，:tabindex，但那給了我一個Javascript錯誤。

Answer 1

Interpolation within attributes is not valid in Vue v2.

您需要的tabindex屬性綁定到key像這樣：

<a href="#" :tabindex="key">Item {{ key }}</a> 

Here's a working fiddle.