element-ui tab标签禁止切换_el-tabs禁用

Tab禁止切换

• 给el-tabs标签设置style=“pointer-events: none;”\
• 注意：每个el-tab-pane标签也要加上style="pointer-events: auto;"否则各个页面的所有鼠标事件都会失效

    <el-tabs v-model="activeName" style="pointer-events: none;">
	    <el-tab-pane label="用户管理" name="first" style="pointer-events: auto;">用户管理</el-tab-pane>
	    <el-tab-pane label="系统管理" name="second" style="pointer-events: auto;">配置管理</el-tab-pane>
	    <el-tab-pane label="角色管理" name="third" style="pointer-events: auto;">角色管理</el-tab-pane> 
  </el-tabs>
1
2
3
4
5

tab跳转指定标签页

• HTML

<el-tabs  v-model="activeName"  tabPane="tabPane">
activeName: "first", // 定义数据，默认展示第一个
1
2

• JS

    tabPane() {
     if (xxx === "y") {
       this.activeName = "second"; 
     } else (xxxx === "y") {
       this.activeName = "third"; 
     }  
   },
1
2
3
4
5
6
7