Vue.use()和Vue.prototype使用详解
Vue.use()作用
官方文档中提到，Vue.use()可以用来注册全局的插件。使用Vue.use()后可以使得插件能够在项目的任意位置上使用。
那么什么时候使用Vue.use()呢？
其实官方文档中也给出了很详细的答案，就是当一个插件对象或者函数，拥有install方法时，就使用Vue.use()。
调用Vue.use()时会调用插件的install方法，使得其能够全局使用。
Vue的使用场景
1.ElementUI、VueRouter等官方插件的使用
在vue官方社区中提供了一系列辅助开发的插件，其中就有很多插件具有install方法，比如ElementUI和VueRouter，我们使用Vue.use()进行引入。
import Vue from 'vue' import VueRouter from 'vue-router'; import Element from 'element-ui' Vue.use(VueRouter); Vue.use(Element);
2.自定义插件，并提供install方法
除了使用官方的插件，我们也可以自定义一些含有install方法的插件
import Icon from '../components/icon/index'
const IconConponents = {
// install 是默认的方法。当外界在 use 这个组件的时候，就会调用本身的 install 方法，同时传一个 Vue 这个类的参数。
install: function (Vue) {
Vue.component('Icon', Icon)
}
}
// 导出
export default IconConponents在main.js中进行注册插件
import Icon from './global' Vue.use(Icon)
Vue.prototype作用
vue.prototype是一种注册全局变量的方式，使用vue.prototype的变量可以全局访问。最典型的例子就是axios。
import axios from 'axios'; Vue.prototype.$http = axios;
注册了axios之后就能在项目的位置使用了，使用的方法：
调用this.$http进行访问。
实际上我们还要注意，使用Vue.prototype注册的全局变量前面都要加上$符号，这是一种规范，主要是为了防止命名冲突。
Vue.use()和Vue.prototype的区别
讲到这里，我们仔细看看这两个方法的区别。
其实很显而易见，Vue.use()用于注册具有install方法的变量，注册后install函数会自动调用，使得install的具体变量能够全局使用，包括全局变量，全局标签等等。
而Vue.prototype就是一个注册全局变量的方法，注册的全局的变量以$开头，调用this方法调用。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
今天小编就为大家分享一篇Vuex,iView UI面包屑导航使用扩展详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
树形下拉框是一个带有下列树形结构的下拉框,本文主要介绍了Vue Treeselect树形下拉框的使用小结,具有一定的参考价值,感兴趣的可以了解一下2023-10-10
本文详细介绍了如何在Vue项目中集成和使用富文本编辑框,并分享了一些实践经验,介绍了为什么需要富文本编辑框,Vue中常用的富文本编辑器,以及如何安装、配置和使用Vue-Quill-Editor,本文还提供了一些基本的配置示例,帮助开发者在实际项目中根据需求进行更多探索和定制2024-10-10
关于vue-property-decorator的基础使用实践
这篇文章主要介绍了关于vue-property-decorator的基础使用实践，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
本文主要介绍了vue-router后台鉴权流程实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-08-08
Vue3 封装 element-plus 图标选择器实现步骤
这篇文章主要介绍了Vue3 封装 element-plus 图标选择器,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了基于vue2.0实现的级联选择器，基于Vue的级联选择器，可以单项，二级， 三级级联，多级级联，有兴趣可以了解一下2017-06-06
本篇文章主要介绍了Vue DevTools调试工具的使用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-12-12
vue Treeselect 树形下拉框:获取选中节点的ids和lables操作
这篇文章主要介绍了vue Treeselect 树形下拉框:获取选中节点的ids和lables操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
这篇文章主要介绍了vue实现一个懒加载的树状表格实例，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-05-05
最新评论