Vue2和Vue3的主要区别详解及版本的过渡历史变迁

这篇具有很好参考价值的文章主要介绍了Vue2和Vue3的主要区别详解及版本的过渡历史变迁。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

vue2简史:作为前端的主流框架之一的vue2发布停止维护经历了23个主要版本更新,Vue 2.7 是当前、同时也是最后一个 Vue 2.x 的次级版本更新。提供 18 个月的长期技术支持 (LTS:long-term support)。在此期间,Vue 2 将会提供必要的 bug 修复和安全修复,但不再提供新特性

Vue 2 的终止支持时间是 2023 年 12 月 31 日。在此之后,Vue 2 在已有的分发渠道 (各类 CDN 和包管理器) 中仍然可用,但不再进行更新,包括对安全问题和浏览器兼容性问题的修复等。

Vue3.0版本于2020年9月18日正式发布。这个版本带来了许多新功能和改进,包括减少开发人员配置工具的次数,并增加了许多内置功能。【vue3兼容vue2写法】。

【重点】:vue2和vue3的重点区别详解:

一、Composition API:

Vue.js 3 引入了 Composition API,这是一个新的 API 风格,允许开发者更好地组织和重用组件逻辑。相比 Vue.js 2 中的选项式 API,Composition API 更灵活,使得代码更易于维护。

二、Vue2、Vue3两者响应式的底层实现不同:

1.Vue2底层是Object.defineProperty,使用Object.defineProperty()对数据进行劫持,也就是数据劫持结合订阅发布模式的方式实现,但有一定的局限性。缺点是它内部有一个this.$set去实现对数组更新的时候无法实现响应式。

2.Vue3底层是通过ES6Porxy, 使用Proxy代理,使用ref或者reactive将数据转化为响应式数据,能够更好地支持动态添加属性和删除属性。 除了对浏览器的兼容性不友好,但它解决了vue2底层实现的缺点,对数组、层级以及比deep的对象处理都很友好。

三、生命周期的区别:(全面对比总结)

Vue2生命周期(左)   VS   Vue3生命周期(右)

beforeCreate————初始化阶段比较—————setup() 

created ——————初始化阶段比较——————setup()

beforeMount ————初始化阶段比较————— onBeforeMount

mounted——————初始化阶段比较—————onMounted 

———————————————————————————————

beforeUpdate———更新阶段比较———onBeforeUpdate 

updated—————更新阶段比较————onUpdated 

activated————更新阶段比较———— onActivated 

deactivated ———更新阶段比较—————onDeactivated

———————————————————————————————

beforeDestroy———销毁阶段比较————onBeforeUnmount 

destroyed ————销毁阶段比较————onUnmounted 

结论:其实两者的生命周期钩子变化并不大,只是为了区分组合式API和响应式API 。

四、语法API的区别:

Vue2选项式API面向对象编程的语法 vue3:组合式API面向函数编程;没有this!!!

vue2图例:

vue2 历史版本,vue.js,javascript,前端

vue3图例:

vue2 历史版本,vue.js,javascript,前端

五、模板指令以及模板中的 v-model:

vue2中,v-for 优先级高于 v-if;      在vue3 中,v-if 优先级高于v-for;(相反)

vue2:

vue2 历史版本,vue.js,javascript,前端

vue3:

vue2 历史版本,vue.js,javascript,前端

v-if or v-for 的区别图------->>>>

vue2 历史版本,vue.js,javascript,前端

 六、Tree-shaking 支持:

Vue.js 2: Tree-shaking 效果相对较差

Vue.js 3: 设计上更有利于 Tree-shaking减小打包体积

结束语总结:时代终究在变迁,不仅是人和物,前端框架亦是如此。vue2之所以强大是因为它随时代的进步迭代了很多版本在不断变迁,经典终究经典 但还是要迈步向前迎接vue3。文章来源地址https://www.toymoban.com/news/detail-842743.html

到了这里,关于Vue2和Vue3的主要区别详解及版本的过渡历史变迁的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue2和vue3的区别

    Vue 2和Vue 3是Vue.js框架的两个不同版本,下面是它们之间的一些主要区别: 性能提升:Vue 3在底层进行了重写,使用了更高效的编译器,生成的代码更小,在运行时有更快的速度和更低的内存消耗。 Composition API:Vue 3引入了Composition API,它使得组件逻辑可以更容易地组织和复用

    2024年01月18日
    浏览(45)
  • vue2和vue3的区别(Vue3升级部分)

    区别有两个目的:一面试说一下书面化的表达,二工作需要升级大白话说一下项目应用的区别。 双向数据绑定: vue2 的双向数据绑定是利⽤ES5 的⼀个 API ,Object.defineProperty()对数据进⾏劫持 结合 发布订阅(gettersetter)模式的⽅式来实现的。 vue3 中使⽤了 ES6 的 ProxyAPI 对数据

    2024年02月12日
    浏览(43)
  • Vue3和Vue2有什么区别?

    先来说说Vue3相对于Vue2的优点吧: 更快的渲染速度 更小的体积 更少的内存占用 更丰富的功能 听起来好像Vue3比Vue2强很多啊,但是具体强在哪里呢?我们来看几个代码例子: 首先是安装Vue3和Vue2: 在Vue3中,如果你想注册一个组件,你可以这样做: 而在Vue2中,你需要这样做:

    2024年02月08日
    浏览(89)
  • 盘点 Vue3 与 Vue2 的区别

    对于生命周期来说,整体上变化不大,只是大部分生命周期钩子名称上 + “on”,功能上是类似的。不过有一点需要注意,Vue3 在组合式API(Composition API,下面展开)中使用生命周期钩子时需要先引入,而 Vue2 在选项API(Options API)中可以直接调用生命周期钩子,如下所示。

    2024年02月03日
    浏览(39)
  • vue3.0与vue2.0的区别

    Vue 3.0是一个用于构建用户界面的JavaScript框架。相比于Vue 2.x,Vue 3.0在性能、体积和开发体验上都有了很大的提升。 以下将从不同的角度上去分析Vue 3.0与Vue 2.0的区别: 从项目搭建和打包工具的选择来看: Vue 2.0 中通常会选择使用 webpack 或者 vue-cli 来进行项目搭建和打包。这

    2024年02月07日
    浏览(35)
  • Vue3与Vue2的区别和优化

    Vue3和Vue2之间存在一些重要的区别。以下是其中的一些主要区别: 1. 性能优化:Vue3通过重新设计和重写了底层的响应式系统,使得Vue在性能方面有了显著的提升。Vue3使用Proxy来实现响应式,而不再使用Object.defineProperty,这样可以避免一些性能问题,并提高了运行时的性能。

    2024年01月22日
    浏览(43)
  • Vue3与Vue2的区别简明笔记

    vue经历从2.0到3.0更新之后,简⽽⾔之就是变得更轻,更快,使⽤起来更加⽅便,每⼀次的版本迭代都是对上⼀个版本的升级优化,不管 是对于我们开发者还是对于⽤户体验都是不断地在越来越⽅便,接下来我会着重于开发者来说⼀下两个不同版本的区别 Vue2 Vue3 beforeCreate 无

    2024年02月09日
    浏览(37)
  • vue2和vue3有啥区别,vue3的优点有哪些?

    Vue.js 是一种流行的 JavaScript 框架,用于开发现代 Web 应用程序。Vue.js 具有简单易用、高效和灵活等特点,能够极大地提高开发效率并改进用户体验。Vue.js 一直在不断更新和改进,它的最新版本是 Vue 3。 在本文中,我们将探讨 Vue 2 和 Vue 3 的区别,以及如何从 Vue 2 迁移到 Vu

    2024年02月06日
    浏览(43)
  • 【前端面经】Vue3和Vue2的区别

    Vue是一种非常流行的JavaScript框架,因其易用性和灵活性在开发人员中备受欢迎。Vue2是Vue框架的上一个重要版本,于2016年发布。但是,Vue3是最新版本的Vue框架,于2020年正式发布并带来了一些重大变化。本文将探讨Vue3和Vue2之间的主要区别。 Vue3的一个显着优势是其更小的代码

    2024年02月02日
    浏览(81)
  • Vue经典面试题:Vue2和Vue3的区别

    双向绑定原理 vue2是用过ES5的一个API Object.defineProperty()对数据进行劫持配合发布订阅者模式的方式来实现的 Vue3是使用了ES6的proxyAPI对数据代理 Vue3支持碎片(Fragments) 就是说组件可以有多个根节点 Composition API vue2采用选项类型API,而vue3采用 合成型API。代码更加的简便整洁 生

    2023年04月19日
    浏览(52)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包