Element-UI局部引入、封装

Element-UI局部引入、封装

• 按照官网的引入只需要注意.babelrc文件就可以了，但是那样的代码很长很杂乱无章。

采纳自大佬的笔记→传送门

1. 最好专门用一个文件夹来封装这个文件
   
2. 选择你需要引入的局部内容
   这里我选择的官网的摘要，如果你引入的部分，但是触发事件会报错应该是你少引入了一些内容
   这里你可以选择es6的import导出，我这里选择的是node的CommonJS导出规则，包括引进也是一样可以的

import {
  Pagination,
  Dialog,
  Autocomplete,
  Dropdown,
  DropdownMenu,
  DropdownItem,
  Menu
} from 'element-ui'
const element = {
  install: function (Vue) {
    Vue.use(Pagination);
    Vue.use(Dialog);
    Vue.use(Autocomplete);
    Vue.use(Dropdown);
    Vue.use(DropdownMenu);
    Vue.use(DropdownItem);
    Vue.use(Menu);
  }
}
module.exports = element;

3. 在入口文件main.js中使用就ok了

import Vue from 'vue'
import App from './App.vue'
import element  from './element/index';
import 'element-ui/lib/theme-chalk/index.css'

Vue.use(element)

• 如果有碰到一些引入Dialog的BUG可以上最上面的跳转连接。