el-tab 用hover切换页面

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

el-tab 用hover切换页面

 

 

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

el-tab 用hover切换页面

 

 

 el-tab 用hover切换页面

 

 

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

el-tab 用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)                     }                 });                 }             });             });         },

 

上一篇:el-table动态表头,表头不能填充


下一篇:用手机自带uc浏览器查看静态页面,css样式不显示