前端经典面试题 吊打面试官系列 之 Vue2和Vue3的区别_vue2和vue3的区别面试题

---

一、回答点

监测机制的变化、Fragments（碎片）的更新、API模式的变更、数据的存放、生命周期钩子、父子传参等。。

二、深入回答

监测机制的变化

• Vue3中使用了ES6中Proxy API 对数据进行代理，监测整个对象，而不再是某个属性。
• 消除Vue2中基于Object.defineProperty的实现所存在的诸多限制。
• Vue3可以监测到对象属性的添加和删除也可以监听到数组的变化。
• Vue3中支持Map、Set、WeakMap和WeakSet

Fragments（碎片）

• Vue2在组件中只能有一个根节点。
• Vue3在组件中可以拥有多个根节点。

API模式的变化

• Vue2使用选项式API（Options API）。Vue3使用组合式API（Composition API）

数据的存放

• Vue2中数据存放在data属性中
• Vue3使用setup()方法，setup()方法在组件初始化构造的时候触发。
  • 从vue引入ref或reactive
  • 简单数据类型使用ref()方法进行处理，复杂数据类型使用reactive()方法进行处理。
  • 使用setup()方法来返回响应式数据，在template可以获取这些响应式数据。

生命周期钩子