vue.js 循环设置ref并在js中循环调用
Html源码:<trv-for="(item,index) inuserList" :key="index"><td>{{item.id}}</td><td>{{item.name}}</td><td:ref="'item'+index">{{item.age}}</td> //循环设置r...
·
Html源码:
<tr v-for="(item,index) in userList" :key="index">
<td>{{item.id}}</td>
<td>{{item.name}}</td>
<td :ref="'item'+index">{{item.age}}</td> //循环设置ref
</tr>
Script源码:
methods: {
change: function() {
var key = 0;
for (key in this.userList) {
if (this.userList[key].age== "绿色") { //根据不同条件针对不同ref,修改样式
this.$refs["item" + key][0].style.color = "green"; //含参数调用
} else if (this.userList[key].age== "红色") {
this.$refs["item" + key][0].style.color = "red";
}
}
}
},
mounted() {
this.change();
}
更多推荐
已为社区贡献11条内容
所有评论(0)