vue鼠标移入添加class样式,鼠标移出去除样式(active)

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/ink_if/article/details/79712600

鼠标移入添加class样式

HTML

HTML绑定事件,加入或者移出class为active

<div class="col-lg-3 col-xs-6 paddingLeft com_marginBtm10 choosePlan" v-on:mouseover="changeActive($event)" v-on:mouseout="removeActive($event)">
   流量套餐
</div>

JS

这里除了active这个class需要动态添加或者减去,其他的皆是移入移出都需要的class

methods:{
      changeActive($event){
             $event.currentTarget.className="col-lg-3 col-xs-6 paddingLeft com_marginBtm10 choosePlan active";
      },
      removeActive($event){
             $event.currentTarget.className="col-lg-3 col-xs-6 paddingLeft com_marginBtm10 choosePlan";
      }
},