vue 和 react 的异同【vue 知识汇点9】

监听数据变化的实现原理不同

• vue 通过 getter/setter 和数据挟持，能准确地知道数据变化，不需要特别的优化就能达到很好的性能
• React 默认是通过比较引用的方式进行的，如果不优化，可能会导致大量不必要的 VNode 的渲染

数据流的不同

• vue 支持双向绑定：1.父子之间通过props 2. 组件和 DOM 之间通过 v-model 双向绑定
• react 不支持双向绑定，提倡单向数据流

HoC 和 mixin

• 当组件需要复用部分功能时，vue 框架使用 mixins，vue 不使用 HoC 是因为 react 本来就是一个函数，高阶组件对于 react 来说很简单，但 vue 就不行了，vue组件是一个被包装的函数，并不简单，所以无法直接把组件的声明包装，返回一个高阶组件。
• react 本来一开始使用的也是 mixins，但后来他们觉得这种方式对组件入侵太强，就转而使用 HoC

模版渲染方式不同

• react 通过 JSX 渲染模版，通过原生 js 实现模版中的常见语法，比如插值、条件、循环等。
• vue 通过一种扩展的 html 语法进行渲染，通过指令来实现。

状态管理不同

• react 使用 redux，每一个组件都需要显式用 connect 把需要的 props 和 dispatch 连接起来，每次都是用新的 state 替换旧的 state，并在检测数据变化的时候，是通过 diff 的方式比较差异
• vue 使用 vuex，在vuex 中，$store 被直接注入到了组件实例中，因此可以灵活的使用，可以直接改变state，在检测数据变化时，是通过 getter/setter 来比较的