Vue.use 經(jīng)歷了什么？

在日常開發(fā)中，有時(shí)候我們需要給 Vue 注入自己的插件。如果每引入一個(gè)組件，再注冊(cè)一下，明顯加大了開發(fā)的工作量，所以我們需要讓每一個(gè) Vue 都具備這個(gè)插件功能，因此我們首選 Vue.use 這個(gè) Vue 的 API。

Vue.use

官方解說地址：https://cn.vuejs.org/v2/api/#Vue-use

Vue.use 它是一個(gè)函數(shù)。接收一個(gè)參數(shù)，這個(gè)參數(shù)有兩種可能，一種是函數(shù)，一種是一個(gè)對(duì)象。如果是一個(gè)對(duì)象，要求必須有 install 方法，在 Vue 實(shí)例化的時(shí)候會(huì)自動(dòng)調(diào)用這個(gè)方法。對(duì)于插件的掛載就可以在這個(gè) install 內(nèi)部解決了。有個(gè)需要注意的地方，install 的第一個(gè)參數(shù)必須是 Vue 構(gòu)造函數(shù)。

案例分享

現(xiàn)在我們就給 Vue 的每個(gè)實(shí)例對(duì)象注入一個(gè)插件，插件里面有個(gè)功能就是純粹打印 “勾勾的前端世界”這個(gè)內(nèi)容。雖然看起來功能很簡單，但過程你不一定會(huì)哦。接下來我們上手試試。

1、在 Vue 項(xiàng)目下新建一個(gè)文件夾，叫 myPlugin。里面有兩個(gè) js 文件，一個(gè) index.js,一個(gè) myPlugin.js。

2、在 myPlugin.js 中代碼如下：

同時(shí) index.js 的內(nèi)容如下：

在 main.js 中，代碼如下：

完事之后，回到控制臺(tái)看打印的 vm 實(shí)例對(duì)象。

在控制臺(tái)，我們就看到自己寫的插件被掛載在 Vue 實(shí)例下了。

推薦閱讀：

如何解決數(shù)組塌陷？

前端配置化平臺(tái)——快速搞定活動(dòng)頁面

基于 Vue CLI 搭建腳手架。

H5 活動(dòng)頁面快速生成神器——Mocha

從理解 React 框架開始，開啟金三銀四面試之旅。

前端典型面試題：為什么 React 選擇使用 JSX ？

尤雨溪 3 天 10 更的 Vite 究竟有什么魔力？

點(diǎn)個(gè)“在看”和“贊”吧，

畢竟我是要成為前端網(wǎng)紅的人。