使用属性修饰器和类样式语法从vue2迁移到vue3
我维护了一个相当大的vue2项目，它在其他库中使用Vuetify、vue-class-component、vue-property-decorator和类型记录。示例组件：
(为了显示语法，组件是简化的，不能编译)
我们对这个设置非常满意，因为它的语法很简单，所以对于新的和现有的开发人员来说很容易理解，并且因为我们在当前的2-3年的时间内没有遇到任何实际的问题。官方对vue2的支持即将结束，我们希望升级到vue3。我们现在的问题是我们应该走哪条路，什么是可能的。我已经研究了很长一段时间了，但在这个话题上仍然很困惑。vue3中的复合API是合理的，人们似乎对它普遍感到满意，这一点我很难理解。除了一些很酷的新特性之外，在我看来，复合API在不容易理解、“冗余”和语法过于明确方面似乎是一种降级。有几个例子：
道具：
Vue2
@Prop({ default: '' }
label!: MyProp;
Vue3
props: {
myProp: {
type: Object as PropType<MyProp>, //Kind of weird explicit type definition
default: ''
},
}变量(函数也是一样的)
Vue2
myValue: string = ""; //Reactive and available in the template
Vue3
setup(props, context) { //Must be setup in the setup function to make it available in the template
const myValue: Ref<string> = ref(""); //Must declare it reactive with this funky explicit syntax
return {
myDataValue, //Must be returned from setup function
};
}计算性质
Vue2
get myValue(): string {
return this.myDataValue.toLowerCase();
}
Vue3
setup(props, context) {
const myValue: ComputedRef<string> = computed(() => {
return myDataValue.value.toLowerCase(); //Accessing a value requires .value
});
}即使我们决定使用组合API，重写我们的代码库也是非常昂贵的，从时间上讲也是如此。
我尝试使用Options从头开始创建一个示例vue3类样式的组件项目(遵循本指南)，然后将一些现有组件复制到项目中。这似乎是工作后，索姆摆弄周围没有花费太多的时间。因此，当Vuetify 3最终发布并且我们可以迁移时，我的问题是：
- Vue3选项API +vue-属性装饰器是可行的方法吗？
- vue-属性装饰库已经有两年没有更新了！而且没有官方的vue3支持文档。那么，这个带有vue3的vue-property装饰师只是一个非常糟糕的主意吗？
- 迁移到复合API中是否值得花费时间和精力？
谢谢!
回答 1
Stack Overflow用户
发布于 2022-06-24 11:04:14
我在过去的中也遇到过同样的问题。我们多年来一直使用Vue 2，数百个组件构建在基于类的组件之上，使用vue类组件和vue-属性装饰器。
现在我们需要升级到Vue 3，以获得更好的性能和长时间的支持。
回答你的问题：
- 我做了很多研究，现在还没有计划支持基于类的组件。以上两个插件被困在Vue 3的RC级别。参见：https://github.com/vuejs/vue-class-component/issues/406。
- 一个没有用Vue的新版本进行维护和/或适当测试的库从来都不是使用imo的好主意。
- 这是一个没有明确答案的问题。但也许这也是给你的：
你可以试试这个策略，也许它也适用于你：
我们通过这些插件将复合API和脚本设置添加到现有的Vue 2代码库中：
更新22/07/10: Vue 2.7 (最后一个小版本)已经发布，在使用这个版本：https://blog.vuejs.org/posts/vue-2-7-naruto.html时不需要上面的插件
这允许我们同时使用组合API +脚本设置和基于类的组件。因此，我们开始用新的语法编写新的组件，并逐步重写旧代码。完成此过程后，我们将使用迁移指南迁移到Vue 3：
这是大量的工作和非常烦人的做法，因为它需要很多时间远离新的功能或错误，这是更重要的处理这种升级痛苦。但是我们希望从现在开始，Vue将在他们的决定和他们想要继续前进的方式上更稳定地告诉我。
我也同意您所说的，基于类的组件是一种比组合API更优雅的方法。它也更短，更接近后端编程语言。看到这首歌走了真让人难过。
最棒的雅各布
进一步研究资料来源：
指南：https://levelup.gitconnected.com/from-vue-class-component-to-composition-api-ef3c3dd5fdda
他们放弃它的更多原因：
https://github.com/vuejs/rfcs/pull/17#issuecomment-494242121
https://vuejs.org/guide/extras/composition-api-faq.html#better-type-inference
https://stackoverflow.com/questions/72742468
复制相似问题
腾讯云开发者
