vue & react
| vue | react | |
|---|---|---|
| 监听数据变化 | Vue 通过 getter/setter 以及一些函数的劫持，能精确知道数据变化 | React 默认是通过比较引用的方式进行的，如果不优化（PureComponent/shouldComponentUpdate）可能导致大量不必要的VDOM的重新渲染 |
| 数据流的不同 |
数据流的不同
|
|
| HoC与mixin | mixin就我的理解是将公共方法提取出来放到Vue实例上便于使用 | 高阶组件本质就是高阶函数，就我的理解高阶组件就是提取出组件间的相同的地方抽象为一个wrapper组件，React 的组件是一个纯粹的函数，所以高阶函数对React来说非常简单（参考：react高阶组件） |
| 组件间的通信 |
组件间的通信
|
|
| 模板渲染方式 | Vue是通过一种拓展的HTML语法进行渲染，是在和组件JS代码分离的单独的模板中，通过指令来实现的，比如条件语句就需要 v-if 来实现 | React 是通过JSX渲染模板，是在组件JS代码中，通过原生JS实现模板中的常见语法，比如插值，条件，循环等，都是通过JS语法实现的 |
vuex & redux
| vuex | redux | |
|---|---|---|
| 数据是否可变 | Vuex的数据是可变的，直接修改值 | Redux 使用的是不可变数据，每次都是用新的state替换旧的state |
| 检测数据变化 | Vuex其实和Vue的原理一样，是通过 getter/setter来比较的 | 通过 diff 的方式比较差异 |
网友评论