Vue.use和Vue.prototype.$xx：亲戚还是路人？

在 Vue 的面试中，一个经常被问到的问题是如何在 Vue 实例上挂载方法或属性。而在这个问题上，Vue.use 和 Vue.prototype.$xx 往往会同时出现。但是，这两者之间究竟是什么关系呢？

Vue.use：插件系统的门户

Vue.use 方法是 Vue 插件系统的入口。它允许开发者向 Vue 应用程序添加自定义功能，而无需修改 Vue 的核心代码。当使用 Vue.use 时，插件会被安装到 Vue 实例上，从而在应用程序中全局可用。

例如，要安装一个名为 vue-router 的路由插件，可以使用以下代码：

Vue.use(VueRouter);

安装后，vue-router 插件将被添加到 Vue 实例上，并且可以像这样使用：

const router = new VueRouter({ /* ... */ });
Vue.use(router);

Vue.prototype.$xx：实例属性和方法的快捷方式

Vue.prototype 是 Vue 实例的原型对象。它允许开发者向所有 Vue 实例添加自定义属性和方法。当使用 Vue.prototype.$xx 时，可以在任何 Vue 实例上访问该属性或方法。

例如，要向所有 Vue 实例添加一个名为 greet 的方法，可以使用以下代码：

Vue.prototype.$greet = function() {
  console.log('Hello!');
};

添加后，可以使用以下方式在任何 Vue 实例上调用 greet 方法：

this.$greet(); // 输出 "Hello!"

关系：无血缘关系，但密切合作

从上面的中，我们可以看出 Vue.use 和 Vue.prototype.$xx 没有直接的血缘关系。它们是 Vue.js 生态系统中两个不同的功能。

然而，它们在 Vue 应用程序的开发中密切合作。Vue.use 用于添加自定义功能，而 Vue.prototype.$xx 提供了一种在所有 Vue 实例上使用这些功能的便捷方式。

小结

综上所述，Vue.use 和 Vue.prototype.$xx 在 Vue.js 中扮演着不同的角色。Vue.use 用于向应用程序添加自定义功能，而 Vue.prototype.$xx 提供了一种在所有 Vue 实例上使用这些功能的便捷方式。虽然它们没有直接的血缘关系，但它们在 Vue 应用程序的开发中密切合作。