vue element 表格使用fixed固定列后切换菜单时错位问题

开发时由于列表数据项过多需要固定操作列，于是在操作列上加了fixed=“right”。
一开始没什么问题，但是在切换菜单时出现了错位现象

后来找到问题，由于vue element-admin 默认是启用路由缓存的，但是element的固定列是动态计算高度的，当你第一次进入页面时并没有问题因为element已经计算好了高度，但是由于切换菜单后缓存的问题第二次进入是没有计算的，这就导致了错位现象。
百度的话很多解决方式，大多都是让你获取数据时doLayout，但是我这个问题并没有获取数据。是由于keep-alive导致的。
所以再查了官方文档后得到的解决方案是，配合actived函数使用。
首先在表格上加上ref="table"属性
然后在activated中加入this.$refs.table.doLayout()

mounted: function() {.....},...activated() {this.$refs.table.doLayout()},....beforeDestroy: function() {},

总结

以上是生活随笔为你收集整理的vue element 表格使用fixed固定列后切换菜单时错位问题的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。