Vue3 对比 Vue2 的变化

Vue3 对比 Vue2 的变化

1.源码组织方式变化:使用 TS 重写

2.支持 compositionAPI,基于函数的 api,更灵活组织组件逻辑(Vue2 使用 options api)

3.响应式系统提升:Vue3 的响应式数据原理改成了 Proxy,可以监听动态新增删除属性,以及数组变化

4.编译优化:Vue 通过标记静态根节点来优化 Diff,Vue 则标记和提升所有静态根节点,Diff 的时候只需要去对比动态节点的内容

5.打包体积优化:移除了一些不常用的 api(inline-template,filter)

6.生命周期的变化,使用 setup 替代了 beforeCreate 和 created

7.template 支持多个根标签

8.Vuex 状态管理,创建实例的方式,Vue2 使用 new store;Vue3 使用 createStore;

9.Route 获取页面实例以及路由信息,Vue2 使用 this 的方式获取;而 Vue3 采用 getCurrentInstance/userRoute,userRouter 的方式来获取

10.对 props 的使用:Vue2 通过 this 的方式使用;Vue3 则直接通过 props 使用;

11.父子组件传值:Vue3 中当子组件向父组件返回数据时,如果使用的是自定义名称,像 backData,则需要在 emits 定义一下

相关推荐
天蓝色的鱼鱼1 小时前
前端开发者的组件设计之痛:为什么我的组件总是难以维护?
前端·react.js
codingandsleeping1 小时前
使用orval自动拉取swagger文档并生成ts接口
前端·javascript
石金龙2 小时前
[译] Composition in CSS
前端·css
白水清风2 小时前
微前端学习记录(qiankun、wujie、micro-app)
前端·javascript·前端工程化
Ticnix2 小时前
函数封装实现Echarts多表渲染/叠加渲染
前端·echarts
用户22152044278002 小时前
new、原型和原型链浅析
前端·javascript
阿星做前端2 小时前
coze源码解读: space develop 页面
前端·javascript
叫我小窝吧2 小时前
Promise 的使用
前端·javascript
NBtab3 小时前
Vite + Vue3项目版本更新检查与页面自动刷新方案
前端
天天扭码3 小时前
来全面地review一下Flex布局(面试可用)
前端·css·面试