VueJS utilisent variable V pour que la valeur de l'attribut

Question

j'ai une boucle itérative en utilisant v-for sur un tableau d'objets qui rend alors un élément de html li

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

Le problème ici est que key dans l'attribut tabindex est n'étant pas rendu, ce qui EST rendu est {{ key }}.

Comment puis-je obtenir la valeur de key à utiliser pour tabindex? J'ai aussi essayé, :tabindex mais cela me donne une erreur Javascript.

Answer 1

Interpolation within attributes is not valid in Vue v2.

Vous devez lier l'attribut tabindex à la key comme ceci:

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

Here's a working fiddle.