当前位置: 首页 > article >正文

vue2 和 vue3的区别

1.生命周期不一样

vue2

vue3

  • beforeCreate
  • created
  • beforeMount
  • mounted
  • beforeUpdate
  • updated
  • beforeDestroy
  • Destroy
  • onBeforeMount()
  • onMounted()
  • onBeforeUpdate()
  • onUpdated()
  • onBeforeUnmount()
  • onUnmounted()

2.Composition组合式api

  • Vue2是选项API(Options API),一个逻辑会散乱在文件不同位置(data、props、computed、watch、生命周期钩子等),导致代码的可读性变差。当需要修改某个逻辑时,需要上下来回跳转文件位置。
  • Vue3组合式API(Composition API)则很好地解决了这个问题,可将同一逻辑的内容写到一起,增强了代码的可读性、内聚性,其还提供了较为完美的逻辑复用性方案。所有逻辑在setup函数中,使用 ref、watch 等函数组织代码。

3.vue2和vue3双向数据绑定原理发生了改变

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

vue3 中使用了 es6 的 ProxyAPI 对数据代理。

4.根节点

  • Vue3 支持碎片(Fragments),就是说在组件可以拥有多个根节点。
  • vue2 只能存在一个根节点,需要用一个div来包裹

5.建立数据 data / setup函数

  • Vue2 这里把数据放入data属性中
  • Vue3 setup函数声明,返回模板需要数据与函数。

6.性能和速度

Vue 3‌:重新编写了虚拟DOM的实现,优化了编译模板,组件初始化和更新性能提高了1.3到2倍,服务器端渲染(SSR)速度提高了2到3倍。此外,Vue 3支持树摇(Tree Shaking),可以只打包需要的模块,减小包大小‌。


http://www.kler.cn/a/387058.html

相关文章:

  • Re78 读论文:GPT-4 Technical Report
  • Jira中bug的流转流程
  • 【机器学习实战入门】使用 Pandas 和 OpenCV 进行颜色检测
  • 时序数据库TDengine 3.3.5.0 发布:高并发支持与增量备份功能引领新升级
  • Redis延迟队列详解
  • YOLOv10-1.1部分代码阅读笔记-build.py
  • Markdown设置字体大小、颜色,CSDN编写字体大小、颜色等样式
  • springboot集成opencv开源计算机视觉库
  • 如何判断 Hive 表是内部表还是外部表
  • aws(学习笔记第十一课) 使用AWS的EFS,以及AWS Storage Gateway
  • 【mySql 语句使用】
  • 矩阵分解及计算
  • 黑马点评1 session实现短信验证码登录
  • docker-ce-stable‘ 下载元数据失败 : Cannot download repomd.xml: Cannot download
  • 【jmeter】jmeter的线程组功能的详细介绍
  • AStar寻路算法
  • java 容器的快速失败(fast-fail)机制
  • HarmonyOS入门 : 获取网络数据,并渲染到界面上
  • SpringMVC处理请求流程
  • Nginx实现负载服务之间的负载均衡
  • 基于 JavaWeb 的宠物商城系统(附源码,文档)
  • 鸿蒙开发案例:七巧板
  • 排序算法简介
  • 数据库的使用05:不规范的写法与操作记录
  • VR的左右眼渲染方法
  • 如何使用 Python 语言的正则表达式进行网页数据的爬取?