element-ui简单使用

1.安装

npm i element-ui -S

2.使用在main.js

import ElementUI from 'element-ui'; 
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

3.sublime text安装element-ui代码片段插件

打开sublime text的安装目录，找到存放插件的目录，例如：Sublime Text 3x64 > Data > Packages，把Element UI Snippets放在该目录下

4.代码片段插件使用教程地址

https://packagecontrol.io/packages/Element UI Snippets

5.使用说明

Element-ui使用：

el-row的gutter属性主要是用来设置元素的左右间隔值（padding）,例如:gutter=’50’，意思是内边距的左边为25px（padding-left），右边距为25px（padding-right）
el-container嵌套里面的元素需要有一个block的元素包住，否则无法撑开容器
el-main、el-aside一些元素有overflow:auto，如果不想出现滚动条可以设置overflow:visible
Element-ui绑定事件使用@click.native
template不能添加css的class
如果需要覆盖element-ui的默认样式，style标签不能添加scoped，可以在页面添加多一个style或不加scoped，但是注意要加上模块来添加class，防止出现重复
父元素设置了margin之后，如果子元素也设置margin会引发margin重叠https://www.jianshu.com/p/52a253eb90cb
修改elementui样式不能加scoped，否则无效，修改完后线上的样式却与本地不一样，原因

是样式的引入顺序决定了打包顺序：

import 'element-ui/lib/theme-chalk/index.css' // element样式 
import '@/assets/css/reset.css' // 全局或重置样式
import App from './App' // App组件样式
import router from './router' // 路由组件样式