<template>
<div class="dev">
<div v-for = "(item,i) in items" :class = "active == i ? 'addclass' : '' " @mouseover='dowm(i)' :key="i">
{ { item.name}} =============== { { i}}
</div>
</div>
</template>
<script>
export default {
name: 'dev',
data () {
return {
items :[
{
name : '点我1',
},
{
name :'点我2',
},
{
name : '点我3',
}
],
active : -1
}
},
created() {
// this init loading function
},
methods: {
dowm(index){
//将点击的元素的索引赋值给变量
this.active = index;
}
},
comments: { },
components:{ }
}
</script>
<style scoped>
.addclass{
border-bottom: 3px solid #fb7299;
color: #fb7299;
}
</style>
vue点击元素添加颜色
原文作者:milijiangjun
原文地址: https://blog.csdn.net/milijiangjun/article/details/108717036
本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
原文地址: https://blog.csdn.net/milijiangjun/article/details/108717036
本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。