从vue2迁移到vue3(迁移过程遇到的一系列问题)

本文是在将项目从vue2迁移到vue3上时遇到的一些问题（从vue2+webpacket 迁移到 vue3+vite），在此进行一些记录，并不能包含所有情况。在https://v3-migration.vuejs.org/zh/breaking-changes/v-model.htmlVue 3 迁移指南 中提到的内容有些不再重复，只记录一些比较重要（对我而言）的。

1.自定义组件时

• prop：value -> modelValue；
• 事件：input -> update:modelValue；

如：

this.$emit('input',this.xxx)

需改为 this.$emit('update:modelValue',xxx) ，组件中对应 props 中的value 改为 modelValue

2.透传 Attributes
当一个组件以单个元素为根作渲染时，透传的 attribute（class、style 和 id等） 会自动被添加到根元素上。
如：子组件中根元素中写有id的要注意，在使用子组件时如果添加了id，这个id会覆盖子组件根元素中的id.

3. 项目组件中定义的name，不要同名（vue2中是可以的）

4. v-for 中使用 v-if 可能出现错误，将v-if 修改为 computed 计算属性
如

5. <transition> 包含多个元素时需要改为<TransitionGroup>（当然<transition> 包含多个元素在vue2中也是不标准的）

6. 组件库组件使用修改
因为vue3较vue2变化大，组件库也会有较大的变化，使用的组件库组件出现错误、显示异常等情况需要查看新的组件库文档确认组件使用是否发生了变化

其实大部分问题在Vue 3 迁移指南 中都有详细说明，迁移时请仔细阅读