vue2和vue3的区别

1、vue2的双向绑定利用的是object.defineProperty()，vue3的双向绑定利用的是Proxy

2、vue3的性能提升：

• 响应式系统的重写
• 虚拟DOM的改进
• 更好的Tree shaking的支持（按需引入）
• 编译器的优化
• 销毁和卸载的改进

3、vue3新增特性：

• vue2—>object.defineProperty()，vue3—>Proxy
• setup：组件实例化前被调用，可以用来设置组件数据、收集依赖、注册事件等
• ref和reactive：用来声明响应式变量和对象
• 新增v-once指令，用于只渲染一次的元素

4、vue2使用选项类型api，vue3使用组合式api

5、vue3支持碎片，vue2不支持

6、建立数据，vue2把数据放入data属性中，vue3shiyongsetup()方法

7、vue3有teleport组件，vue2没有

8、生命周期不同：vue2中beforeCreate 组件创建之前；created 组建创建之后；beforeMount 组件挂载到页面之前执行；Mounted 组件挂载到页面之后执行，beforeUpdate 组件更新之前；updated组件更新之后；vue3中setup 开始创建组件；onBeforeMount 组件挂载到页面之前执行；onMounted 组件挂载到页面之后执行；onBeforeUpdate 组件更新之前；onUpdated 组件更新之后

9、父子传参不同：Vue2父传子，用props ；子传父用事件Emitting Events。在Vue2 中，会调用this$emit 然后传入事件名和对象。Vue3父传子，用props;子传父用Emitting Events 。在Vue3 中的setup()中的第一参数content 对象中就有 emit,那么我们只要在setup()接收第二个参数中使用分解对象法取出emit 就可以在setup 方法中随意使用了。

10、指令与插槽不同：

vue2中使用slot 可以直接使用slot ;v-for 与v-if 在Vue2中优先级高的是v-for 指令，而且不建议一起使用。vue3中必须是使用v-slot的形式；vue 3中v-for 与v-if ，只会把当前v-if 当作v-for 的一个判断语句，不会相互冲突