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版本不一致的错误。
参考: