vuev-text-field设置标签颜色

1、首先打开vuev-text-field。

2、其次点击开始，并找到标签设置。

3、最后在界面中找到颜色即可完成vuev-text-field设置标签颜色。

代码思路：

遍历出data里面的数据 v-for

给li加点击事件

绑定class样式 怎么控制样式的显示

通过 class的控制 :class={class:index==变量} 下标和class变量是否相等控制true false

<template>

<div id="app">

<ul>

<li v-for='(item,index) in arr' :class='{bg:index==isactive}'

@click='fn(index)'>{{item}}</li>

</ul>

</div>

</template>

<script>

export default {

data () {return { data:{isactive:0, //默认第一个有样式arr:['健康医疗','生活服务','信息安全','文化娱乐'],

},

}

},

methods: {

fn (index) {

//点击切换 变量的值 赋值为 index

this.isactive=index console.log(index) } },}</script><style scoped lang='less'> .bg {color: red }</style>

---