vue项目中升级element ui(含常见报错及解决方案,如表格不显示,el-table无效, “__v_isRef“ is not defined,Use :deep() instead)

升级 element ui 的标准流程

  1. 删除原依赖文件夹 node_modules
  2. 执行命令安装最新版 element ui
cnpm i element-ui -S

若 cnpm 无法使用,则需先安装 cnpm

npm i cnpm
  1. 执行命令安装其他依赖
cnpm i

常见报错及解决方案

报错 “__v_isRef“ is not defined

报错描述:页面中使用 el-table 时,表格不显示,控制台报错 “__v_isRef“ is not defined

报错原因: element ui升级时,没有先删除node_modules 文件夹,导致node_modules 中仍存留有旧版本的依赖导致报错。

解决方案:按标准流程先删除node_modules 文件夹,再升级element ui,最后重新安装其他依赖

项目打包时报错 Use :deep() instead

报错描述:页面中使用 >>> 或 /deep/ 或 ::v-deep ,项目打包时会警告 the >>> and /deep/ combinators have been deprecated. Use :deep() instead

报错原因: 最新版的 element ui 弃用了 >>> 、 /deep/ 和 ::v-deep,改使用 :deep() 代替

解决方案:将项目中的 >>> 、 /deep/ 和 ::v-deep 改为 :deep() ,使用范例如下

:deep(.ant-select-selector) {
	height: 30px !important;
}

使用 el-date-picker 时控制台报错

报错内容为:Prop being mutated: "placement"

报错原因: 2.15.6 以上版本的 element ui 的 el-date-picker 源码中加了这个控制台的报错

解决方案:通过以下命令,降低版本

cnpm install element-ui@2.15.6

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注