vue实现选中效果

            <li v-for="(item,index) in itemData " :key="index">
              <el-button
                v-bind:class="{
         active:item.id==link}"
                type="text"
                icon="el-icon-folder"
                @click="getDiary(item)"
              >{{item.title}}</el-button>
            </li>

关键部分
实现选中的部分

v-bind:class="{active:item.id==link}"

css

.active {
  color: #409eff;
}

data

  data () {
    return {
      link: '' // 当前选中的分类
 }     
}

methods

getDiary(item){
      this.link = item.id
}

active: 自定义选中的css属性名称
item.id: 此例中为每一个循环的id
link: 全局定义的要选中的选项

实现思路
点击每一个列表选项时，给全局变量link赋值唯一id
选中css样式添加条件为link=当前选项的id