vue与react的区别

相似之处

  他们都是 JavaScript 的框架，专注于创造前端的数据应用。

不同于早期的 JavaScript 框架“功能齐全”，Reat 与 Vue 只有框架的骨架，

其他的功能如路由、状态管理等是框架分离的组件。

  都使用了虚拟 DOM，Virtual DOM 是一个映射真实 DOM 的 JavaScript

对象，如果需要改变任何元素的状态，那么是先在 Virtual DOM 上进行改

变，而不是直接改变真实的 DOM。当有变化产生时，一个新的 Virtual

DOM 对象会被创建并计算新旧 Virtual DOM 之间的差别，之后这些差别会

应用在真实的 DOM 上。

  组件化 React 与 Vue 都鼓励组件化应用

  Props React 和 Vue 都有'props'的概念，props 在组件中是一个特殊的属

性，允许父组件往子组件传送数据。

构建工具 React 和 Vue 都有自己的构建工具，你可以使用它快速搭建开发

环境。

区别

O 数据

vue：双向数据绑定和单向数据流。双向数据绑定： DOM 元素绑定的

data 值，当发生改变后，vue 的响应式机制会自动监听 data 的变化重新

渲染。单向数据流：当父组件给子组件传递数据的时候，子组件只可以读取

而不能修改数据。可以用 watch 监听数据的更改，再赋给父组件的变量。

react：单向数据流。DOM 元素依赖于 state，但改变 state 不会改变渲染

好的 DOM，通过 setState() 才能重新渲染。父组件传值到子组件，如果顶

级的 props 变了，会重新渲染所有的子组件。 76

  虚拟 DOM

vue：计算出虚拟 DOM 的差异，在渲染的过程中跟踪每个组件的依赖关

系，不会重新渲染整个组件树

  react：当应用的状态改变时，重新渲染全部子组件，可以通过 s

houldComponentUpdate 生命周期进行优化

模板和 jsx：

vue：具有单文件组件，可以把 html、css、js 写在一个 vue 文件里----

MVVM 框架

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