使用element-plus官方demo进行测试,当点击第二个tab的时候,console出的avtiveName值是第一个tab的name,如图
目前需求是想要在点击一个tab的时候把名字通过动态路由的方式添加在路由后面,如果拿到的是前一个tab的名称拼到路由后肯定是有问题的。
如何做到点击一个tab就获取对应的name呢?
需要补充的是我的el-tab-pane写了如图中的插槽
tab-change事件一直无法触发
直接将tab-click的事件中获取的tabpaneName赋值给activeName确实可以实现,但是仍然无法解决路由名称与对应tab名称不一致的问题。会出现点击一个tab,路由拼接的是上一个tab的name
可以看出,执行click后并不会立刻更改paneName的值,而是会等异步的beforeLeave执行完成,才会去更改,因为before-leave可能会阻止tab的切换
所以如果想在click中获取paneName的值可以使用tab.paneName,但是按照你的逻辑应该切换成功再去更改路由,那么应该监听tab-change事件

看了下更新日志,tab-change事件在2.18版本才加入

这样的话可以:1、升级element-plus版本(推荐),2、使用watch监听activeName,3、使用tab-click