创建方式不同

vue2 是一个构造函数，通过new创建一个Vue实例

new Vue({})

vue3 是一个对象。通过对象Vue的createApp()方法创建一个vue实例

Vue.createApp({})

挂载容器的方式不同

vue2

new Vue({
  el: '#app'
})

new Vue({}).$mount('#app')

vue3

Vue.createApp({}).mount('#app')

双向数据绑定原理改变

vue2 的双向数据绑定是利用ES5 的一个 API Object.definePropert()对数据进行劫持 结合 发布订阅模式的方式来实现的。
vue3 中使用了 es6 的 ProxyAPI 对数据代理。

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

生命周期钩子 — Lifecyle Hooks

Vue2--------------vue3
beforeCreate  -> setup()
created       -> setup()
beforeMount   -> onBeforeMount
mounted       -> onMounted
beforeUpdate  -> onBeforeUpdate
updated       -> onUpdated
beforeDestroy -> onBeforeUnmount
destroyed     -> onUnmounted
activated     -> onActivated
deactivated   -> onDeactivated

API风格的改变

Vue2与Vue3 最大的区别 — Vue2使用选项类型API（Options API）对比Vue3合成型API（Composition API）
旧的选项型API在代码里分割了不同的属性: data,computed属性，methods，等等。新的合成型API能让我们用方法（function）来分割，相比于旧的API使用属性来分组，这样代码会更加简便和整洁。

vue2 Options API（选项式API）存在的问题：
使用传统的Options API时，新增或者修改一个需求，就需要分别在data、methods、computed、watch等里面不断地寻找、修改。如果代码量大的时候，修改起来就很痛苦。

vue3中 Composition API（组合式API）的优势：
更加优雅的组织我们的代码、函数，让相关功能的代码更加有序的组织在一起，都写在setup里面。甚至可以把他们都变成一个个hook函数，修改那部分就可以直接去对应的文件里修改。把定义数据、方法这部分也添加了模块化封装的思想

技术栈-拍档对比