【elementUI】el-tab相关问题

Tabs 标签页

分隔内容上有关联但属于不同类别的数据集合。

javascript 复制代码
<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
    <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
    <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
    <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
  </el-tabs>
</template>
<script>
  export default {
    data() {
      return {
        activeName: 'second'
      };
    },
    methods: {
      handleClick(tab, event) {
        console.log(tab, event);
      }
    }
  };
</script>

1.tab栏有a b c,点击b,保持a高亮

javascript 复制代码
<el-tabs
				v-model="type"
				type="card"
				:before-leave="tabTypeBeforeLeave"
			>

		tabTypeBeforeLeave(val, oldVal) {
			if (val === 'b') {
				return false;
			} 
		},
相关推荐
阿珊和她的猫1 天前
IIFE:JavaScript 中的立即调用函数表达式
开发语言·javascript·状态模式
阿珊和她的猫1 天前
`require` 与 `import` 的区别剖析
前端·webpack
+VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue在线音乐播放系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
智商偏低1 天前
JSEncrypt
javascript
谎言西西里1 天前
零基础 Coze + 前端 Vue3 边玩边开发:宠物冰球运动员生成器
前端·coze
+VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue律师咨询系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·课程设计
努力的小郑1 天前
2025年度总结:当我在 Cursor 里敲下 Tab 的那一刻,我知道时代变了
前端·后端·ai编程
GIS之路1 天前
GDAL 实现数据空间查询
前端
OEC小胖胖1 天前
01|从 Monorepo 到发布产物:React 仓库全景与构建链路
前端·react.js·前端框架
2501_944711431 天前
构建 React Todo 应用:组件通信与状态管理的最佳实践
前端·javascript·react.js