vue2.0版本引入Element-ui问题解决
作者:fyupeng
技术专栏:☞ https://github.com/fyupeng
项目地址:☞ https://github.com/fyupeng/distributed-blog-system-api
留给读者
使用版本:
vue:2.6.14
element-ui:2.15.14
一、问题及解决
1、安装后组件没有生效,报错:
`main.js:74 [Vue warn]: Property or method "__v_isRef" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
- 解决方案(已验证):
npm i element-ui -S
全局引入,介意启动项目太慢选择局部引入:
import Vue from 'vue'
import ElementUI from 'element-ui'; // ui组件
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
import App from './App.vue'
....
// 放最后面,只能有一个 Vue 实例
new Vue({
el: '#app', // 指定挂载点
router, // 注入路由
store, // 注入 Vuex store
render: h => h(App) // 渲染 App 组件作为根组件
});
无需配置 CDN link
标签就不配置,我就是配置后导致失效的。
2、遇到组件引入后,比如<el-input>
报错:
[Vue warn]: Property or method "__v_isRef" is not defined on the instance but referenced during render.
- 解决方案(已验证):清理和重建项目:删除 node_modules 文件夹和任何锁文件(如 yarn.lock 或 package-lock.json),然后重新安装依赖项。
二、总结
简洁、高效、易用!