這篇文章主要介紹如何使用use注冊Vue全局組件和全局指令，文中介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們一定要看完！
Vue中的組件和指令分為局部組件、局部指令和全局組件、全局指令。對于注冊有一定數(shù)量的全局指令和全局組件時，官方文檔中的方法就顯得有些不夠清爽了。
全局組件
在Vue官方文檔中介紹的是使用Vue.component(tagName, options)來創(chuàng)建一個全局組件。但是這種方法是與根實例寫在同一個文件中，如果要同時注冊多個全局組件，就會使根實例文件過重，因此使用Vue.use()來“安裝”全局組件，就顯得更輕一些。
方法：
1.新建一個plugins文件夾
2.在文件夾中創(chuàng)建放置全局組件的文件components.js
3.在components.js文件中引入所有要注冊的全局組件
4.在app.js根實例文件中，引入components.js
以eg組件為例:
components.js:
重慶分公司
重慶分公司
import eg from '../components/eg.vue';
export default (Vue)=>{
Vue.component("Eg",eg);
}app.js:
import components from './plugins/components.js'; Vue.use(components);
經(jīng)過上述編寫后，就注冊了全局組件Eg。
在需要注冊多個全局組件的情況下，使用這種方式就顯得更加清爽！
全局指令
對于全局指令的注冊，官方文檔給出的方法是使用Vue.directive()，位置同樣是在根實例文件下，那么問題來了，如果多個全局指令，再加上多個全局組件，那么app.js文件將變得臃腫無比。
因此，同上面的注冊全局組件方法相似，也是使用Vue.use()來“安裝”全局指令。
方法：
1.新建一個plugins文件夾
2.在文件夾中創(chuàng)建放置全局組件的文件directives.js
3.在directives.js文件中引入所有要注冊的全局指令
4.在app.js根實例文件中，引入directives.js
以v-focus指令為例：
directives.js:
export default (Vue)=>{
Vue.directive("focus",{
inserted:function(el){
el.focus();
}
})
}app.js
import directives from "./plugins/directives.js" Vue.use(directives);
這樣就注冊了全局指令。
以上是“如何使用use注冊Vue全局組件和全局指令”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計公司行業(yè)資訊頻道！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
