- 博客主页:音符犹如代码
- 系列专栏:JavaWeb
- 关注博主,后期持续更新系列文章
- 如果有错误感谢请大家批评指出,及时修改
- 感谢大家点赞👍收藏⭐评论✍
什么是Element?
Element:它是由饿了么团队开发的一个技术框架,它基于Vue.js的桌面端组件库,提供了一些丰富的组件库,可以帮助开发者快速的搭建出精美的前端页面
官网:Element - The world's most popular Vue UI framework
Element组件库:
我们使用组件库首先要安装组件库,这里官网推荐我们使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用。
npm i element-ui -S
下载好后可以在我们的文件目录中看到element-ui这个文件夹
接下来我们要在main.js中写入官网中给的代码
import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
Vue.use(ElementUI);
new Vue({
el: '#app',
render: h => h(App)
});
我们可以新建一个文件夹,在新的文件夹中创建一个以.vue为结尾的文件,写入我们要用的组件库的代码,在新文件中我们写好大体框架
如此,我们就可以去官网找我们需要的组件库,把代码粘贴到新建的vue文件中的<templat>中,然后后我们要在App.vue中<templat>中打出你新建的vue文件名称后vscdoe就会自动导入,如此就是完成了一个组件库的一个基本的使用了
其实Element的组件库非常简单,官网都把代码写好了,不需要大家打太多的代码,找到我们自己需要的组件库主打一个ctrl c+ctrl v(也算是程序员的一种快乐哈哈哈哈),然后记得在App.vue的文件中引用。