今天小编就为大家分享一篇Vue点击切换颜色的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
如下所示:
<template> <div> <div v-for="(list,index) in siYuan" :class="{ red:changeRed == index}" @click="change(index)">{{list.a}}</div> </div> </template> <script> export default { data(){ return{ siYuan:[ {"a":"田"}, {"a":"心"}, {"a":"水"}, {"a":"原"} ], changeRed:-1 } }, methods:{ change(index){ this.changeRed = index; } } } </script> <style> .aa{ cursor: pointer; } .red{ color: red; } </style>
以上这篇Vue点击切换颜色的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章: