vue、react之间有什么区别?

vue、react之间有什么区别?下面本篇文章给大家介绍一下vue和react的区别。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

先看看Vue和React的介绍

Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

React是一个用于构建用户界面的开源JavaScript库,主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。React 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它。

React视图通常采用包含以自定义HTML标记规定的其他组件的组件渲染。React为程序员提供了一种子组件不能直接影响外层组件("data flows down")的模型,数据改变时对HTML文档的有效更新,和现代单页应用中组件之间干净的分离。

vue和react的区别

虚拟DOM:

vue:计算出虚拟DOM的差异,在渲染的过程中跟踪每个组件的依赖关系,不会重新渲染整个组件树

react:当应用的状态改变时,重新渲染全部子组件,可以通过shouldComponentUpdate生命周期进行优化

模板和jsx:

vue:具有单文件组件,可以把html、css、js写在一个vue文件里----MVVM框架

react:依赖于jsx,在JavaScript中创建DOM----视图层框架

数据绑定

vue是响应式的数据双向绑定系统,而react是单向数据流,没有双向绑定。

应用

vue的语法较为简单,适用于小型项目创建,而react更适用于Web端和原生App的开发,侧重于大型应用。

组件写法不一样

react推荐的做法是JSX+inline style,也就是把HTML和CSS全都写进javaScript了

state对象

state对象在react应用中是不可变的,需要使用setState方法更新状态

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

模板渲染方式的不同

在表层上,模板的语法不同,React是通过JSX渲染模板。而Vue是通过一种拓展的HTML语法进行渲染,但其实这只是表面现象,毕竟React并不必须依赖JSX。

在深层上,模板的原理不同,这才是他们的本质区别:React是在组件JS代码中,通过原生JS实现模板中的常见语法,比如插值,条件,循环等,都是通过JS语法实现的,更加纯粹更加原生。而Vue是在和组件JS代码分离的单独的模板中,通过指令来实现的,比如条件语句就需要 v-if 来实现对这一点,这样的做法显得有些独特,会把HTML弄得很乱。

举个例子,说明React的好处:react中render函数是支持闭包特性的,所以我们import的组件在render中可以直接调用。但是在Vue中,由于模板中使用的数据都必须挂在 this 上进行一次中转,所以我们import 一个组件完了之后,还需要在 components 中再声明下,这样显然是很奇怪但又不得不这样的做法。

更多web前端开发知识,请查阅 HTML中文网 !!

以上就是vue、react之间有什么区别?的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » Vue.js 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

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

支付宝扫一扫打赏

微信扫一扫打赏