今天為大家所介紹是elementUI，對，他就是那個和美團(tuán)外賣，百度外賣三分天下的那個餓了嗎外賣平臺，Elementui是由餓了么前端團(tuán)隊推出的基于vue封裝的UI組件庫,提供了豐富的PC端組件，簡化了常用組件的封裝，大大降低了開發(fā)難度，并在多人合作開發(fā)網(wǎng)頁的過程中，極大的提高了開發(fā)速度。 下面為大家?guī)韊lementUI組件的安裝和使用方法。

一、elementUI在項(xiàng)目中的引入

1.首先，我們來到elementUI的官網(wǎng)，點(diǎn)擊右上角組件，官網(wǎng)為大家提供了一套完整的安裝方案（能看到這篇文章的小伙伴肯定已經(jīng)安裝好了node.js，如果沒有安裝的話可以查閱之前的相關(guān)文檔），請大家復(fù)制本段代碼在vsCode的終端或cmd命令提示符中下載依賴。

npm i element-ui -S

然后來到main.js中引入和應(yīng)用我們下載的包，復(fù)制以下代碼

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
 
//此處應(yīng)用elementUI
Vue.use(ElementUI);
 
new Vue({
    el: '#app',
    render: h => h(App)
});

Ps：以上為全局引入element，會導(dǎo)致原來并沒有用到的一些屬性或標(biāo)簽被應(yīng)用到Vm身上，大概會會導(dǎo)致跑腳手架的時候加載時間過長，為此element為我們提供了按需引入，這樣會大大加快腳手架的加載速度，缺點(diǎn)每應(yīng)用一個新標(biāo)簽就需要到main.js中引入新的屬性，如果你能忍受腳手架每次載入時多加載一秒的弊端，還是推薦使用全局引入。

PPs：這里提一句題外話，如果大家使用npm時安裝其他包的非常緩慢，可以檢查一下是否安裝了淘寶鏡像。

npm config get registry

如果返回的是https://registry.npm.taobao.org則說明鏡像已配置。

如果不是，而且下載比較慢的話，可以使用以下代碼來更換淘寶鏡像。

npm config set registry https://registry.npm.taobao.org

二、element在項(xiàng)目中的使用

通過上一步，我想大家應(yīng)該安裝好了依賴，那么接下來的事就非常簡單了。

現(xiàn)在，請大家把鍵盤上除了ctrl和c，v以外的鍵全都扣了，多留一個都是對element框架的侮辱。

這里按照最簡單的按鈕為大家做一個演示。

然后把你復(fù)制的這一段放到