'無狀態功能組件'優於'ES6類組件'有什麼優勢？

我經常讀到，如果可能的話，我應該使用「無狀態函數組件」，但大多沒有任何解釋。有什麼好處？'無狀態功能組件'優於'ES6類組件'有什麼優勢？

2016-07-12 Rotareti

谷歌搜索這兩個短語每個出現在[本文]（https://facebook.github.io/react/docs/reusable-components.html）作爲第一個結果。它列出了好處。儘管如此，這太寬泛了。也許你應該閱讀一些文章，然後回來解釋你所知道的和不知道的。 – 4castle

我看過那篇文章。他們只是提供了關於這些好處的很少的信息。我認爲這將有助於我和其他人從中獲得更多的細節。 – Rotareti

有趣。「擱置」。這是完全正確的問題。好的答案很簡短，並且沒有太多「你真的看到」太多答案「或者」太長「了嗎？ – gaperton

首先，無狀態函數組件渲染速度更快，因爲React渲染管道中存在優化的短路徑。

其次，代碼更清晰，因爲您鍵入的次數更少，幾乎沒有視覺噪音。當然，如果你使用現代JS。檢查出來，我定義一些「自定義標籤」：

const MyFancyDiv = ({ children, ...otherProps }) => (
    <div { ...otherProps } className='i-am-fancy-wrapper'> 
     { children } 
    </div> 
);

對於不具備的狀態，背景，或自定義生命週期方法的一切，這是首選的方式。

它實際上是React的特性，它使得很難擊敗任何其他框架。儘可能使用它。

2016-07-12 19:20:25 gaperton

不是一個優點，但可能值得注意：功能組件根本沒有實例。類組件有實例，但是你永遠不需要直接創建一個組件實例--React負責這個。 –

是的，這是它們渲染速度更快的原因之一。沒有實例，沒有生命週期鉤子，簡化了渲染路徑。 – gaperton

回答