【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;
			} 
		},
相关推荐
旧曲重听119 分钟前
前端需要掌握多少Node.js?
前端·node.js
Mr.Jessy20 分钟前
Web APIs 学习第四天:DOM事件进阶
开发语言·前端·javascript·学习·ecmascript
云枫晖23 分钟前
前端工程化实战:手把手教你构建项目脚手架
前端·前端工程化
醉方休24 分钟前
开发一个完整的Electron应用程序
前端·javascript·electron
故作春风30 分钟前
手把手实现一个前端 AI 编程助手:从 MCP 思想到 VS Code 插件实战
前端·人工智能
不会算法的小灰38 分钟前
Vue.js 基础教程:从入门到实践
前端·javascript·vue.js
掘金一周42 分钟前
没开玩笑,全框架支持的 dialog 组件,支持响应式| 掘金一周 11.6
前端·人工智能
拉不动的猪1 小时前
浏览器&Websocket&热更新
前端·javascript·vue.js
那些免费的砖1 小时前
Reka UI - 一款免费开源的 Vue 无头 UI 组件库,样式定制开发项目的绝佳选择
vue.js·ui·开源
Never_Satisfied1 小时前
在JavaScript中,将包含HTML实体字符的字符串转换为普通字符
开发语言·javascript·html