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

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";
 }
},

 <div class="index_tableTitle clearfix" v-for="(item,index) in table_tit">
 <div class="indexItem">
 <span :title="item.name">{{item.name}}</span>
 <span class="mypor">
 <i class="icon" @mouseenter="enter(index)" @mouseleave="leave()"></i>
 <div v-show="seen&&index==current" class="index-show">
 <div class="tip_Wrapinner">{{item.det}}</div>
 </div>
 </span>
 </div>
 </div>

 export default {
 data(){
 return{
 seen:false,
 current:0
 }
 },
 methods:{
 enter(index){
 this.seen = true;
 this.current = index;
 },
 leave(){
 this.seen = false;
 this.current = null;
 }
 }
 }