vue.use是什么呀？-木庄网络博客

本文摘自PHP中文网，作者青灯夜游，侵删。

vue.use是一个官方API，是全局注册一个组件或者插件的方法，如果插件（plugin）是一个对象，必须提供install方法；如果插件是一个函数，它会作为install方法。该方法需要在调用“New Vue()”之前被调用。

本教程操作环境：windows7系统、Vue2.9.6版，该方法适用于所有品牌电脑。

官方API介绍：

Vue.use(plugin)

参数

{Object | function} plugin

用法

安装Vue.js 插件。如果插件(plugin)是一个对象，必须提供install方法。如果插件是一个函数，它会作为install方法。install方法调用时，会将Vue作为参数传入。

该方法需要在调用New Vue()之前被调用。

当install方法被同一个插件多次调用，插件将只会被安装一次。

Vue.use的使用

Element-UI例子

根据ElementUI文档，在Vue cli搭建的项目中这样使用ElementUI

/*
mian.js
*/
import Vue from 'vue';
import ElementUI from 'element-ui'; // 1
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
 
Vue.use(ElementUI); // 2
 
new Vue({
el: '#app',
render: h => h(App)
});

以上代码便完成了Element的引入，需要注意的是，样式文件需要单独引入。
后面就可以在Vue的单文件组件中直接使用<el-xxx></el-xxx>来使用Element元素。
所以这到底发生了什么？

1、第一处注释导入ElementUI

1	`import ElementUI from` `'element-ui'`

// TODO 理解如何导入模块

以下是src/index.js的内容。可以看到，index.js导出了一个对象，在上面的import语句中，这个对象被赋予ElementUI的变量名。请注意到这里的install函数。

/*
index.js
*/
export default {
  version: '2.11.1',
  locale: locale.use,
  i18n: locale.i18n,
  install,
  ...
};

2、第二处注释安装ElementUI

阅读剩余部分

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者

转载请注明出处：木庄网络博客 » vue.use是什么呀？

vue.use是什么呀？

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

相关推荐

评论