Element-ui 组件全局引入简写

简介

element-ui项目开发过程中，需要在main.js中，需要引用element-ui中的组件

引用一个写一个 这样看起来很丑也很恶心，看起来很烦，这里呢给大家带来一个新鲜的套路

上代码

import {
  Button,
  Select,
  Aside,
  Main,
  Container,
  Header,
  Menu,
  MenuItem,
  MenuItemGroup,
  Submenu,
  Breadcrumb,
  BreadcrumbItem,
  Dropdown,
  DropdownItem,
  DropdownMenu,
  Avatar,
  Form,
  FormItem,
  Input,
  Card,
  Checkbox,
  CheckboxButton,
  Option,
  OptionGroup,
  DatePicker,
  Col,
  TimePicker,
  Switch,
  CheckboxGroup,
  Radio,
  RadioGroup,
  InputNumber,
  Table,
  TableColumn,
  Pagination,
  Dialog,
  Tree,
  Steps,
  Step,
  Upload,
  Progress,
  Row,
} from "element-ui";

const element = {
  install(Vue: any) {
    Vue.use(Row);
    Vue.use(Form);
    Vue.use(FormItem);
    Vue.use(Button);

    Vue.use(Select);

    Vue.use(Main);
    Vue.use(Container);
    Vue.use(Header);
    Vue.use(Menu);
    Vue.use(MenuItem);
    Vue.use(MenuItemGroup);
    Vue.use(Submenu);
    Vue.use(Breadcrumb);
    Vue.use(BreadcrumbItem);
    Vue.use(Dropdown);
    Vue.use(DropdownItem);
    Vue.use(DropdownMenu);
    Vue.use(Avatar);
    Vue.use(Input);
    Vue.use(Card);
    Vue.use(Checkbox);
    Vue.use(Option);
    Vue.use(OptionGroup);
    Vue.use(Aside);
    Vue.use(DatePicker);
    Vue.use(Container);
    Vue.use(Col);
    Vue.use(TimePicker);
    Vue.use(MenuItem);
    Vue.use(MenuItemGroup);
    Vue.use(Switch);
    Vue.use(CheckboxGroup);
    Vue.use(BreadcrumbItem);
    Vue.use(Radio);
    Vue.use(CheckboxButton);
    Vue.use(InputNumber);
    Vue.use(Progress);
    Vue.use(RadioGroup);
    Vue.use(Table);
    Vue.use(TableColumn);
    Vue.use(Pagination);
    Vue.use(Pagination);
    Vue.use(Dialog);
    Vue.use(Tree);
    Vue.use(Steps);
    Vue.use(Step);
    Vue.use(Upload);
  },
};
export default element;

main.ts中引入

import elementComponents from "./utils/element";

谢谢观看，如有不足，敬请指教