vue2和vue3的区别

1.响应式原理

vue2使用ES5的API，也就是Object.defineProperty进行数据劫持，结合发布者-订阅者模式实现。


vue3使用proxy来实现。


相比与vue2，使用proxy API 优势有：defineProperty只能监听某个属性，不能对全对象进行监听；可以省去for in 、闭包等内容来提升效率（直接绑定整个对象即可）；可以监听数组，不用再去单独的对数组做特异性操作，vue3可以检测到数组内部数据的变化。

2.vue只自支持一个根节点，而vue3支持多个根节点。

3.vue3增加了组合API，使代码更加简洁。

Vue2 与vue3 最大的区别是vue2使用选项类型api，对比vue3合成型api。旧得选项型api在代码里分割了不同得属性：data,computed,methods等；新得合成型api能让我们使用方法来分割，相比于旧的API使用属性来分组，这样代码会更加简便和整洁。

4.生命周期vue3增加了 setup() ，替代了beforeCreate和Created，像其他生命周期的名字也发生了变化。

vue2                                         vue3
beforeCreate                  ->            setup()
Created                       ->            setup()
beforeMount                   ->            onBeforeMount
mounted                       ->            onMounted
beforeUpdate                  ->            onBeforeUpdate
updated                       ->            onUpdated
beforeDestroyed               ->            onBeforeUnmount
destroyed                     ->            onUnmounted
activated                     ->            onActivated
deactivated                   ->            onDeactivated

5.vue2和vue3的diff算法也发生了变化，vue2会比较每一个虚拟节点，而vue3只会比较变化的虚拟节点。

6.v-if和v-for的优先级也发生了变化。

在vue2中，v-for 的优先级要高于v-if，这样会造成性能的浪费。


在vue3中，v-if 的优先级要高于v-for。