您现在的位置是:网站首页> 编程资料编程资料

vue3使用element ui的方法实例_vue.js_

2023-05-24 627人已围观

简介 vue3使用element ui的方法实例_vue.js_

前言

element-ui支持vue2版本,当用vue3安装element-ui的时候会报错,这就需要安装element-plus版本来用到vue3项目中。

element-ui网址:https://element.eleme.cn/#/zh-CN/

element-plus网址:https://element-plus.gitee.io/zh-CN/

1、首先安装element-plus

npm install element-plus --save

可以在package.json中检查是否安装成功

 出现这一行就证明安装成功了...

2、修改main.js或main.ts文件

import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; import store from "./store"; import ElementPlus from 'element-plus'; import 'element-plus/theme-chalk/index.css'; import locale from 'element-plus/lib/locale/lang/zh-cn' createApp(App).use(store).use(router).use(scroll).use(ElementPlus, { locale }).mount("#app"); 

3、然后在代码中使用

然后应该就可以了...

4、有的会出现报错,那就再安装一下element ui

npm install element-ui -S

补充:新引入Element Plus

npm install element-plus --save

main.js中引入

import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' // import '@/assets/scss/reset.scss' import ElementUI from 'element-plus' import 'element-plus/lib/theme-chalk/index.css' createApp(App).use(store).use(router).use(ElementUI).mount('#app')

启动后,项目能正常显示。

总结

到此这篇关于vue3使用element ui的文章就介绍到这了,更多相关vue3使用element ui内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!

-六神源码网