ElementUI更新版本后页面崩溃

当前版本:Vue@2.5.10,ElementUI@2.13.2  

问题描述:由于项目ElementUI的版本比较老,新页面中要使用Slider中的Marks展示标记,老版本的ElementUI不支持,需要更新版本,但是将ElementUI更新到最新的2.13.2版本后,部分页面卡住。

解决过程:遇到这个问题时,第一想法就是ElementUI新旧版本不兼容,查了一些资料后,发现有人通过删除el-tab-pane标签内部的内容解决了这个问题,即

<!--修改前-->
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
    <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
</el-tabs>

<!--修改后-->
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
    <el-tab-pane label="用户管理" name="first"></el-tab-pane>
</el-tabs>

但官方文档上是在el-tab-pane标签内添加了内容,由于项目需要也要在标签内部添加内容,于是否定了这个解决方案。

然后我在github上搜索issue,发现了有人提交了相同的issue,和我出现的问题一样,原因就是Vue老版本和ElementUI新版本不兼容,提升了Vue版本解决了这个问题。

最终解决方案:

Vue@2.5.10---->Vue@2.6.10

Vue-template-compiler@2.5.10---->Vue-template-compiler@2.6.10

注:Vue-template-compiler版本也需要更新,否则会报和Vue版本不一致的错误。

参考:

https://segmentfault.com/q/1010000009857163

https://github.com/ElemeFE/element/issues/15712(最终解决方案)

posted @ 2020-10-27 11:11  MrZhaoyx  阅读(420)  评论(0编辑  收藏  举报