React与Vue的区别

简介: React与Vue的区别

React与Vue的相同点

(1)都支持服务器渲染;


(2)都是数据驱动视图;


在以前,我们需要频繁操作DOM实现页面效果。而Vue和React就隐藏了DOM的频繁操作,采用数据驱动视图的方式,只需要关注数据的变化。


(3)都遵循组件化思想;

React和Vue都遵循组件化思想,它们把注意力放在UI层,将页面分成一一些细块,也就是组件,组件之间组合嵌套就形成最后的网页界面。


(4)都使用虚拟DOM;


(5)都有状态管理;


react有redux,vue有vuex。

不同点


(1)框架本质不同;


Vue本质是MVVM框架,是由MVC发展来的;

React是前端组件框架,是由后端组件演化而来的。


(2)数据流不同;


Vue实现双向绑定,在vue1.0中有两种方法可以实现双向绑定,父子组件之间的props以及组件与DOM直接的v-model。vue2去掉了第一种双向绑定方法,通过v-model实现数据双向绑定。


React一直不支持双向绑定,提倡的是单向数据流(onChange/setState)。


(3)监听数据变化的实现原理不同;


Vue通过getter,setter以及一些函数的劫持,能精确知道数据的变化。

React是通过比较引用方式(diff)进行的,当应用的状态改变时,全部组件都会重新渲染。


(4)组件写法差异;


React推荐的做法是JSX + inline style, 也就是把 HTML 和 CSS 全都写进 JavaScript 中;

Vue 推荐的做法是 template 的单文件组件格式,即 html,css,JS 写在同一个文件(vue也支持JSX写法)


(5)渲染过程不同。


Vue可以更快地计算出Virtual DOM的差异,这是由于它在渲染过程中,会跟踪每一个组件的依赖关系,不需要重新渲染整个组件树。


React在应用的状态被改变时,全部子组件都会重新渲染。通过shouldComponentUpdate这个生命周期方法可以进行控制。


(6)在state上的不同;


React中,state对象需要用setState方法更新状态;

在Vue中,state对象不是必须的,数据由data属性在vue对象中管理。


相关文章
|
存储 Linux 调度
OpenStack如何支持虚拟化技术?
【8月更文挑战第21天】
659 0
|
7月前
|
缓存 JavaScript 前端开发
Dockerfile全面指南:从基础到进阶,掌握容器化构建的核心工具
Dockerfile 是容器化开发中的关键工具。理解并掌握其使用方式,不仅能提高开发效率,还能让你的应用具备更强的可移植性和灵活性。通过优化配置和合理安排构建步骤,可以打造更轻量、更高效的容器镜像。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
Rust 定位技术
一行命令快捷构建在线地图字体切片服务
一行命令快捷构建在线地图字体切片服务
168 3
|
12月前
|
网络协议 算法 网络性能优化
HCIP-Datacom H12-821 题库 (29)
HCIP-Datacom H12-821 题库 (29)
113 1
|
Oracle Java 关系型数据库
玩客云安装Armbian和部署jdk环境
该文介绍了在玩客云设备上安装Armbian系统和Java SDK的步骤。首先,需要准备玩客云设备、Armbian镜像文件和USB工具。然后,通过短接点刷入Armbian系统,并通过SSH访问。接着,从可信源下载Java SDK,将其解压并移动到合适目录,编辑环境变量使其生效。最后验证Java安装成功。注意选择兼容版本并备份数据。内容涵盖了ROM开发相关技术。
482 2
|
算法 安全 程序员
Visual Studio实用调试技巧---让你成为高端的程序员
Visual Studio实用调试技巧---让你成为高端的程序员
408 0
Visual Studio实用调试技巧---让你成为高端的程序员
|
前端开发
前端 CSS 经典:box-shadow
前端 CSS 经典:box-shadow
151 1
|
缓存 新能源 中间件
我看技术人的成长路径
有一句诗词说:宠辱不惊,看庭前花开花落;去留无意,望天上云卷云舒。其实就是讲内心修炼到了一种心境平和,淡泊自然的境界。
5121 72
我看技术人的成长路径
|
算法 前端开发
2665. 计数器 II
2665. 计数器 II
80 0