1、数据双向绑定原理不同
Vue2中使用了Object.defineProperty方法来实现数据响应式,但是这种方式存在一些限制,比如无法监听数组下标变化,需要使用特殊的方法来处理。而Vue3中使用了ES6中的Proxy来实现数据响应式,解决了Vue2存在的问题,并且性能更高。
2、是否支持碎片化
vue3是支持碎片化的,也就是可以拥有多个根节点,而vue2则不支持碎片化。
3、API类型不同
Vue2 是 选项式API(Option API),一个逻辑会散乱在文件不同位置(data、props、computed、watch、生命周期函数等),导致代码的可读性变差,需要上下来回跳转文件位置。Vue3 组合式API(Composition API)则很好地解决了这个问题,可将同一逻辑的内容写到一起。
4、生命周期不同
| 选项式API下的生命周期函数使用 | 组合式API下的生命周期函数使用 |
|---|---|
| beforeCreate | 不需要(直接写到setup函数中) |
| created | 不需要(直接写到setup函数中) |
| beforeMount | onBeforeMount |
| mounted | onMounted |
| beforeUpdate | onBeforeUpdate |
| updated | onUpdated |
| beforeDestroyed | onBeforeUnmount |
| destroyed | onUnmounted |
| activated | onActivated |
| deactivated | onDeactivated |