其他分享
首页 > 其他分享> > el-tab 用hover切换页面

el-tab 用hover切换页面

作者:互联网

1.用hover切换页面 ,click跳转到更多

 

 

 2.先调接口获取到国家政策和地方政策的数据,定义两个变量接收返回的数据

 

 

 

 

 

 3.在mounted中调用hover触发的方法

 

最后献上代码(只要将拿到的值赋值给newData就行了)

 

        nextTick(){             this.$nextTick(() => {             this.$refs.navTabs.$refs.nav.$nextTick(() => {                 // 此时tab的nav才渲染dom 否则拿不到el-tabs__item                 var target = document.getElementsByClassName("el-tabs__item");                 let that = this;                 for (let i = 0; i < target.length; i++) {                 target[i].addEventListener("mouseover", () => {                     that.$refs.navTabs.handleTabClick(1, String(i));                     if(i==0){                         that.newData=that.countryData                         console.log("this.countryData",that.countryData)                     }else if(i==1){                         that.newData=that.localData                         console.log("this.localData",that.localData)                     }                 });                 }             });             });         },

 

标签:nextTick,el,hover,refs,tab,localData,newData
来源: https://www.cnblogs.com/guohanting/p/14670621.html