vue組件和react組件的原理有什么不同？

很高興回答你的問題:

兩個組件的原理我準備用比較的方式來了解下，畢竟通過比較才知道各有各的優勢吧。

共同點都使用虛擬dom。提供了響應式和組件化的視圖組件。注意力集中保持在核心庫，而將其他功能如路由和全局狀態管理交給相關的庫。區別監聽數據變化的實現原理不同

Vue 通過 getter/setter 以及一些函數的劫持，能精確知道數據變化，不需要特別的優化就能達到很好的性能。

React 默認是通過比較引用的方式進行的，如果不優化（PureComponent/shouldComponentUpdate）可能導致大量不必要的VDOM的重新渲染。

2. 數據流的不同

大家都知道Vue中默認是支持雙向綁定的。在Vue1.0中我們可以實現兩種雙向綁定：

父子組件之間，props 可以雙向綁定

組件與DOM之間可以通過 v-model 雙向綁定。

在 Vue2.x 中去掉了第一種，也就是父子組件之間不能雙向綁定了（但是提供了一個語法糖自動幫你通過事件的方式修改），并且 Vue2.x 已經不鼓勵組件對自己的 props 進行任何修改了。

所以現在我們只有 組件 <--> DOM 之間的雙向綁定這一種。

然而 React 從誕生之初就不支持雙向綁定，React一直提倡的是單向數據流，他稱之為 onChange/setState()模式。

3. HoC 和 mixins

在 Vue 中我們組合不同功能的方式是通過 mixin，而在React中我們通過 HoC (高階組件）。

4. 組件通信的區別

5. 模板渲染方式的不同

React 是通過JSX渲染模板

Vue是通過一種拓展的HTML語法進行渲染