Vue.use 经历了什么?

勾勾的前端世界

共 883字,需浏览 2分钟

 ·

2021-03-23 18:47

在日常开发中,有时候我们需要给 Vue 注入自己的插件。如果每引入一个组件,再注册一下,明显加大了开发的工作量,所以我们需要让每一个 Vue 都具备这个插件功能,因此我们首选 Vue.use 这个 Vue 的 API。


Vue.use

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


Vue.use 它是一个函数。接收一个参数,这个参数有两种可能,一种是函数,一种是一个对象。如果是一个对象,要求必须有 install 方法,在 Vue 实例化的时候会自动调用这个方法。对于插件的挂载就可以在这个 install 内部解决了。有个需要注意的地方,install 的第一个参数必须是 Vue 构造函数。


案例分享

现在我们就给 Vue 的每个实例对象注入一个插件,插件里面有个功能就是纯粹打印 “勾勾的前端世界”这个内容。虽然看起来功能很简单,但过程你不一定会哦。接下来我们上手试试。


1、在 Vue 项目下新建一个文件夹,叫 myPlugin。里面有两个 js 文件,一个 index.js,一个 myPlugin.js。


2、在 myPlugin.js 中代码如下:



同时 index.js 的内容如下:



在 main.js 中,代码如下:



完事之后,回到控制台看打印的 vm 实例对象。



在控制台,我们就看到自己写的插件被挂载在 Vue 实例下了。


推荐阅读:

如何解决数组塌陷?

前端配置化平台——快速搞定活动页面

基于 Vue CLI 搭建脚手架。

H5 活动页面快速生成神器——Mocha

从理解 React 框架开始,开启金三银四面试之旅。

前端典型面试题:为什么 React 选择使用 JSX ?

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


点个“在看”和“”吧,

毕竟我是要成为前端网红的人。

浏览 31
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报