vue2和vue3比较
一.vue3新特性:
1.数据响应重新实现(ES6的proxy代替Es5的Object.defineProperty)
2.源码使用ts重写,更好的类型推导
3.虚拟DOM新算法(更快,更小)
4.提供了composition api,为更好的逻辑复用与代码组织
5.自定义渲染器(app、小程序、游戏开发)
6.Fragment,模板可以有多个根元素
二.vue2 vue3响应原理对比
1.vue2使用Object.defineProperty方法实现响应式数据
2.缺点:
无法检测到对象属性的动态添加和删除
无法检测到数组的下标和length属性的变更
3.解决方案:
vue2提供Vue.$set动态给对象添加属性
Vue.$delete动态删除对象属性
重写数组的方法,检测数组变更
------------------------------------------------------------------------------------
1.vue3使用proxy实现响应式数据
2.优点:
可以检测到代理对象属性的动态新增和删除
可以见到测数组的下标和length属性的变化
3.缺点:
es6的proxy不支持低版本浏览器 IE11
回针对IE11出一个特殊版本进行支持
vue2和vue3比较的更多相关文章
- Vue2和Vue3技术整理1 - 入门篇 - 更新完毕
Vue2 0.前言 首先说明:要直接上手简单得很,看官网熟悉大概有哪些东西.怎么用的,然后简单练一下就可以做出程序来了,最多两天,无论Vue2还是Vue3,就都完全可以了,Vue3就是比Vue2多了一 ...
- vue2升级vue3:vue2 vue-i18n 升级到vue3搭配VueI18n v9
项目从vue2 升级vue3,VueI18n需要做适当的调整.主要是Vue I18n v8.x 到Vue I18n v9 or later 的变化,其中初始化: 具体可以参看:https://vue- ...
- vue2和vue3生命周期的区别
概念 首先,我们了解一下"生命周期"这个词.通俗的来说,生命周期就是一个事务从出生到消失的过程.例如,一个人从出生到去世.在vue中,vue的生命周期是指,从创建vue对象到销毁v ...
- vue2升级vue3指南(二)—— 语法warning&error篇
本文总结了vue2升级vue3可能会遇到的语法警告和错误,如果想知道怎样升级,可以查看我的上一篇文章:vue2升级vue3指南(一)-- 环境准备和构建篇 Warning 1.deep /deep/和 ...
- vue2升级vue3:Vue Demij打通vue2与vue3壁垒,构建通用组件
如果你的vue2代码之前是使用vue-class-component 类组件模式写的.选择可以使用 https://github.com/facing-dev/vue-facing-decorator ...
- 盘点Vue2和Vue3的10种组件通信方式(值得收藏)
Vue中组件通信方式有很多,其中Vue2和Vue3实现起来也会有很多差异:本文将通过选项式API 组合式API以及setup三种不同实现方式全面介绍Vue2和Vue3的组件通信方式.其中将要实现的通信 ...
- vue2和vue3的区别?
vue2和vue3的主要区别在于以下几点: 1.生命周期函数钩子不同 2.数据双向绑定原理不同 3.定义变量和方法不同 4.指令和插槽的使用不同 5.API类型不同 6.是否支持碎片 7.父子组件之间 ...
- vue2与vue3的差异(总结)?
vue作者尤雨溪在开发 vue3.0 的时候开发的一个基于浏览器原生 ES imports 的开发服务器(开发构建工具).那么我们先来了解一下vite Vite Vite,一个基于浏览器原生 ES i ...
- Vue2与Vue3的组件通讯对比
Vue2 父传子 父传子比较简单, 主要通过以下步骤实现 父在template中为子绑定属性 <Child :childData='pMsg'/> <!-- 也可以写死 --> ...
随机推荐
- AI异构通信:重压下的突围,华为P50系列的卓越体验
撰文 |懂懂 编辑 | 秦言 来源:懂懂笔记 "华为不会让消费者失望."华为消费者业务CEO余承东在P50系列发布会上如是说. 今年4月美国对华为第四轮制裁以来,华为终端产品无缘5 ...
- MySQL高级语句(二)
目录: 1.别名 2.子查询 3.EXISTS 4.连接查询 5.CREATE VIEW 视图 6.UNION 联集 7.交集值 8.无交集值 9.CASE 10.算排名 11.算中位数 12.算累积 ...
- Java学习笔记--注解和反射
注解和反射 1. 注解 注解作用: 对程序做出解释 被其他程序读取 注解格式: @注释名,还可以添加一些参数值,例如@SuppressWarnings(value="unchecked&qu ...
- C#动态构建表达式树(三)——表达式的组合
C#动态构建表达式树(三)--表达式的组合 前言 在筛选数据的过程中,可能会有这样的情况:有一些查询条件是公共的,但是根据具体的传入参数可能需要再额外增加一个条件.对于这种问题一般有两种方法: a. ...
- BF算法(串模式匹配算法)
主串和子串 主串与子串:如果串 A(如 "shujujiegou")中包含有串 B(如 "ju"),则称串 A 为主串,串 B 为子串.主串与子串之间的关系可简 ...
- python matplotlib.pyplot 条形图详解
python matplotlib.pyplot 条形图详解 一.创建直方图 可以用bar函数来创建直方图 然后用show函数显示直方图 比如: import matplotlib.pyplot as ...
- PHP打印跟踪调试信息
对于大部分编译型语言来说,比如 C . Java . C# ,我们都能很方便地进行断点调试,但是 PHP 则必须安装 XDebug 并且在编辑器中进行复杂的配置才能实现断点调试的能力.不过,如果只是简 ...
- CreateRemoteThread创建远程线程
要实现线程的远程注入必须使用Windows提供的CreateRemoteThread函数来创建一个远程线程 该函数的原型如下: HANDLE CreateRemoteThread( HANDLE hP ...
- 【Markdown】Shell命令高亮显示
[问题]shell命令,黏贴到简书的代码块上,#后面的命令显示成被注释掉的效果 image.png [目的]高亮显示shell命令 [方案1]在代码块标示符后,加上此代码块所用的语言名(请注意要用小写 ...
- Markdown 编写技巧汇总(一)
编写文档,有很多格式选择,也有不同平台选择.下面就自己接触到的MarkDown编写文档的各种技巧做简单梳理,供自己参阅,也希望帮到网友. [1]添加空格 ① 这种写法比较老土,但是,很实用!注意都 ...