为什么 Vue3 插件的工作方式与以往不同

在 Vue2 中，大多数插件将属性注入到 this 上。例如可以通过 this.$router 访问 Vue 路由器。

但是，setup() 方法不再包含对 this 的相同引用。进行这种更改的主要原因是增加了对 Typescript 的支持。

那么在 Vue3 中该如何访问我们的插件呢?可以用 provide 和 inject 来帮助我们在 Vue 程序中注入依赖项。Provide/inject 用于依赖项注入，可以使我们能在 Vue 程序的根目录中提供插件，并且然后将其注入子组件中。

在 Composition API 中，只能在 setup() 方法期间调用这两种方法。

什么是 provide 和 inject

我们需要某种键来识别依赖关系， Javascript 的 Symbol 可以复合这种要求。

然后 provide 方法会将我们的 Symbol 与某个值相关联，而 inject 方法会用相同的 Symbol 检索这个值。

下面是一个例子：

根据上述代码，在某些根组件中，我们提供了插件，并向其传递了组件函数。然后无论想在哪里使用都必须将其注入到我们的组件中。

组件永远不必真正进行 provide/inject 调用，而只需调用插件公开的 provideStore/useStore 方法即可。

还能用旧的插件吗

简单的来说是：能。如果多说点，那就是取决于你自己的想法。

可以继续使用 Options API，并且对 this 的引用方式与以前相同，并且所有旧插件的工作方式都不变。

但是迁移到 Vue3 并利用其所有功能觉得是值得的。

只要你想用 Vue2 的 Options API，你的插件就可以正常工作。但是，很多维护良好的插件或库都应该添加对 Vue3 的支持。