时间:2021-05-26
一、CDN
目前可以通过 unpkg.com/element-ui 获取到最新版本的资源,在页面上引入 js 和 css 文件即可开始使用。
<!-- 引入样式 --><link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"><!-- 引入组件库 --><script src="https://unpkg.com/element-ui/lib/index.js"></script>二、npm安装
1、打开终端(开发工具中打开或(win+r)后输入cmd进入)
2、进入到对应的项目中
例:
3、输入vue add element后回车,等待一小会
4、它会提示你是全局引入(Fully import)还是按需引入(Import on demand),选择 Fully import回车即可
5、然后会提示(输入N回车即可)
6、然后会提示你选择语言,选择zh-CN回车即可
7、引入完成(在src目录下会新增一个plugins文件夹和element.js文件)
三、测试是否成功引入
1、在main.js文件中引入element.js
import './plugins/element.js'在.vue文件中输入<el-button>el-button</el-button>最后 npm run serve 运行项目,若结果显示出下图的按钮效果则表示引入成功!
四、最后附上Element-UI组件库的使用文档地址
https://element.eleme.cn/#/zh-CN/component/installation
总结
到此这篇关于Vue中正确使用Element-UI组件的文章就介绍到这了,更多相关Vue使用Element-UI组件内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
在vue2.0中引用element-ui组件库element-ui是由饿了么团队开发的一套基于Vue2.0的桌面端组件库。官网:http://element.e
前言随着我们vue3.0的出现,我们的ui组件库也有了一些变化,像我们的旧版的element-ui已经不能在vue3.0中使用了,如果要使用element的话需
vue使用element-ui中的Notification自定义按钮并实现关闭功能及如何处理多个通知使用element-ui中的Notification,只有一
Nuxt使用create-nuxt-app创建项目时,选择使用Element-UI为默认组件库,发现Nuxt没有开启Element-UI的按需引入配置,需要自行
Vue原生实现右键菜单组件,零依赖快速安装npminstallvue-contextmenujs使用测试中使用的是element-ui图标importConte