全局注册组件在一个变量中，迁移到Vue 3

Question

将项目迁移到Vue 3。遇到困难，请帮忙。在辅助函数中有一个实例，例如:

let VueDevice = new Vue({
data: {
isTablet: false,
isMobile: false,
isDesktop: false,
},
//...Methods that calculate screen size});

并将其设为全局变量:

Object.defineProperties(Vue.prototype, {
...
device: {
get() {
return VueDevice;
}
}
});

现在我可以通过这个变量在任何组件中使用数据、方法:

//some component
...
methods: {
foo() {
if(this.device.isMobile) {
// do something
}
},
...

如何在Vue 3做同样的?通过另一个组件的变量数据和根组件的任何组件中的方法，我能使用什么呢?

Answer 1

根据Vue 3文档

组合API现在是代码重用的首选方法组件之间。https://vuejs.org/api/options-composition.html mixin

在这种情况下，我认为'插件'是你需要https://vuejs.org/guide/reusability/plugins.html#introduction

还有两个选项，你可以看一下:

• 提供/注入https://vuejs.org/api/options-composition.html提供

• Pinia https://pinia.vuejs.org/