动态修改el-tab-pane 的label(整理)

简介: 动态修改el-tab-pane 的label(整理)

更详细内容看官方文档:Tabs 标签页

<template>
 <el-tabs v-model="name" @tab-click="clickTab">
    <el-tab-pane :label="'用户管理('+num+')'" name="first">用户管理</el-tab-pane>
    <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
    <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
  </el-tabs>
</template>
<script>
export default {
  data() {
    return {
      num:'10',
      name: "second",
    };
  },
  methods: {
    clickTab(tab, event) {
      console.log(tab, event);
    },
  },
};
</script>
相关文章
Element UI之el-tabs的样式修改字体颜色、下划线、选中/未选中
Element UI之el-tabs的样式修改字体颜色、下划线、选中/未选中
4223 0
|
前端开发
饿了么el-dialog自定义内容以及el-dialog自定义样式
饿了么el-dialog自定义内容以及el-dialog自定义样式
1418 0
|
前端开发
vue3 中wangEditor富文本编辑器上传图片功能
vue3 中wangEditor富文本编辑器上传图片功能
1435 0
Element的el-table行列错位对不齐问题处理
本文目录 1. 问题表现 2. 问题发现 3. 问题处理 4. 另一种处理方案
6290 0
Element的el-table行列错位对不齐问题处理
|
编解码 前端开发
Element el-row el-col 布局组件详解
本文目录 1. 背景 2. 分栏布局 3. 分栏间隔 4. 分栏偏移 4. 对齐方式 5. 响应式布局 6. 小结
7820 0
Element el-row el-col 布局组件详解
|
13天前
|
缓存 人工智能
阿里千问Qwen3.7-Max模型费用价格表及5折费率表(一目了然)
阿里云百炼推出面向智能体的Qwen3.7-Max大模型,现享5折优惠!输入6元/百万tokens、输出18元/百万tokens,并免费赠送100万tokens试用额度。该模型在Arena全球盲测中位列国产第一,性能领先Kimi、DeepSeek等竞品。速至阿里云百炼平台领取优惠券并体验:https://t.aliyun.com/U/fPVHqY
|
数据格式
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
本文介绍了在ElementUI和ElementPlus中使用`el-table`组件实现合并行功能的技巧,包括多列合并和单列合并的方法,并提供了相应的示例代码和运行效果。
10755 46
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
|
11月前
|
缓存 前端开发 JavaScript
如何配置Vite以确保最佳的Tree Shaking效果?
如何配置Vite以确保最佳的Tree Shaking效果?
1439 57
|
JavaScript
Vue组件传值异步问题--子组件拿到数据较慢
Vue组件传值异步问题--子组件拿到数据较慢
780 154