vue2和vue3的区别?

发布时间 2024-01-09 00:49:18作者: 前端自信逐梦者

vue2和vue3的区别?

1. 双向数据绑定原理不同。

vue2利用Object.defineProperty()实现数据劫持,结合发布订阅模式实现。
vue3利用proxy实现数据代理。

2. 是否支持碎片

vue2模板中只能有一个根节点。
vue3中可以有多个根节点。

3. API类型不同

vue2中使用的选项式API
vue3中使用的是组合式API

4. 生命周期不同

vue3中没有beforeCreate()和created(),取而代之的是setup()
vue2--------------------------vue3
beforeMount --------onBeforeMount
mounted -------------onMounted
beforeUpdate -------onBeforeUpdate
updated ---------------onUpdated
beforeDestroy -------onUnmount
destroyed -------------onUnmounted

5. vue3中多了一些组件

Teleport组件(瞬移组件) 和Suspense组件 (异步组件)

6. v-if 和 v-for的优先级

vue2中,两者同时使用,v-for的优先级高于v-if
vue3中,两者同时使用,v-if的优先级高于v-for

7. 插槽不同

vue2中使用slot
vue3中必须使用v-slot

8. 修饰符

vue3去除了.native修饰符
vue3去除了keyCode作为事件修饰符
vue3 去除了过滤器,建议用计算属性代替