Par exemple de code?:
étape 1?: Obtenez un tableau d'objets de données à partir du serveur?: [obj, obj, obj],
étape 2?: Ajoutez un objet navigateur obj à chaque sous-objet?:
for(let i = 0; i<array.length; i++){
array[i].myObj = false,
}
添加之后的結果是每一個數組子對象obj中的屬性里面就會多了一個自定義的瀏覽器對象屬性:myObj:false
étape 3?: Liez cet attribut à la structure HTML pour contr?ler la classe dynamique
html:
<ul>
<li v-for='item in array' @click='changeBg(item)'>
<span :class='{'change_bg':item.myObj}'>qwer</span>
</li>
</ul>
js:
methods: {
changeBg(item){
item.myObj = true
}
}
css:
.change_bg
background: red
Le résultat est?: l'attribut myobj a été modifié en true à chaque fois que vous cliquez dessus, mais la classe dynamique ne prendra effet que lorsque ul sera actualisé (une fois actualisée, les données ul ne seront pas réacquises).
Bonne réponse à l’étage. étant donné que l'attribut est ajouté dynamiquement, vous devez utiliser la méthode set fournie par vue pour faire de l'attribut un attribut accesseur ES5 afin de suivre les modifications.