JavaScript

超轻量级php框架startmvc

vue实现鼠标移入移出事件代码实例

更新时间:2020-08-19 09:48:01 作者:startmvc
本文实例为大家分享了vue实现鼠标移入移出事件的具体代码,供大家参考,具体内容如下<

本文实例为大家分享了vue实现鼠标移入移出事件的具体代码,供大家参考,具体内容如下


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

以上所述是小编给大家介绍的vue实现鼠标移入移出事件详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

vue鼠标移入移出 vue 鼠标事件