如何给el-tab的el-tab-pane的label添加未读消息红点？

gmf7461s

231027

发布于
2023-09-07 广西南宁市

如图，如何给el-tab的el-tab-pane的label添加未读消息红点或者是未读消息的数量。

javascript 前端 typescript vue.js

阅读 3.3k

2 个回答

得票最新

玛拉_以琳

8.7k41541

发布于
2023-09-07 上海

更新于
2023-09-07

✓ 已被采纳

可以通过具名 slot 来实现自定义标签页的内容

<el-tabs>
  <el-tab-pane>
    <span slot="label">
      <el-badge :value="12" class="item">
      <i class="el-icon-date"></i> 我的行程
      </el-badge>
    </span>
  </el-tab-pane>
</el-tabs>

显示不全是我环境的问题, 一般使用不会

前端搬运工

7311418

发布于
2023-09-07 陕西

使用插槽slot="label"可以自定义标签内容，demo

查看全部 2 个回答

推荐问题

不同页面之间可以通过localstorage保存响应式吗？
A页面选择一些选项，B页面上有一个下拉框，下拉框的内容和A页面上选中的内容同步，这该怎么做？这可以通过vue的响应式来实现吗？
6 回答3k 阅读✓ 已解决
扁平化数组转换成树形?
背景：需要将扁平化数组转换成树形数组。比如原始数组如下： {代码...} 期望转换后的数据 {代码...}
8 回答4.8k 阅读✓ 已解决
省市区街道数据在哪里可以下载？
省市区街道数据在哪里可以下载？
6 回答3.5k 阅读✓ 已解决
两个promise问题？
第一个问题，这个为什么先输出3后输出2呢 {代码...} 第二个问题，这个为什么会交错输出呢，142536 {代码...} promise小白一枚，上述两个疑问，希望能得到详细的解答
5 回答2.9k 阅读✓ 已解决
网站的不同域名互相跳转如何保持登录态？
一个网站部署了多个域名（不是子域名），比如：www.abc.com和www.aaa.com,如何从一个域名跳转到另一个域名的时候，仍然保持登录态呢？
6 回答2.4k 阅读
Vue项目一个报错无法找到原因?
排查了好久实在没有找到哪儿出了问题，时不时弹出来，编译结果又是正常的，尝试排查了好久但是一直没有办法排查出来，有遇到过这种报错的同学吗？或者有没有同学提供一种排查思路，因为我真的搞懵逼了。哈哈哈。
5 回答6.4k 阅读✓ 已解决
如何在JavaScript中从外部中断for循环的执行？
js中如何从外部中断for循环，起因是这段代码上层会反复进入这个for循环，每次进入的时候需要清除之前的执行效果，所以需要在循环外部来取消？大佬们知道如何做吗？
4 回答2.3k 阅读✓ 已解决

Microsoft

子站问答

访问

如何给el-tab的el-tab-pane的label添加未读消息红点？

不同页面之间可以通过localstorage保存响应式吗？

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

两个promise问题？

网站的不同域名互相跳转如何保持登录态？

Vue项目一个报错无法找到原因?

如何在JavaScript中从外部中断for循环的执行？

Microsoft