美文网首页
vue 实现动态绑定class属性

vue 实现动态绑定class属性

作者: 飞鱼_JS | 来源:发表于2017-08-26 23:36 被阅读0次
    <span v-for="(list2,index) in lists2" :class="{'searchactive':ind2 === index}"  @click="changeBgc2(index)" >{{list2}}</span>
    //----------------------------------------------------------------------------
    data(){
      return {
           ind:"",
    }
    },
    methods:{
    changeBgc2:function(index){
          this.ind2=index;
        },
    }
    //---------------------------------------------------------------------------------------
    <style>
     .searchactive {
       border-radius: 4px;
       line-height: 22px;
       padding: 1.2px 10px;
       text-align: center;
       color: rgba(16, 142, 233, 1);
       margin: 0 5px;
       cursor: pointer;
       border: 1px solid rgba(16, 142, 233, 1)!important;
     }
    </style>
    

    相关文章

      网友评论

          本文标题:vue 实现动态绑定class属性

          本文链接:https://www.haomeiwen.com/subject/roovdxtx.html