高階函數執行

Question

我對重組中的高階函數感到困惑。 我正在使用codePen中的示例，並且不確定為什么更改功能不起作用。

我嘗試在控制台中播放，但沒有任何效果。

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness}) => () => ({happiness: happiness + 1}), 
  }
); 

當我改變到

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness})  => ({happiness: happiness + 1}), 
  }
); 

當我單擊按鈕時，什么也沒有發生。

當我更改為：

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness}) => () => ({happiness: happiness + 1}), 
  }
); 

我得到“我是NaN％快樂按鈕！

我正在使用它進行練習： https : //codepen.io/Kiwka/pen/vWZVvL?editors=0111

Answer 1

我認為您無法將標准“要傳遞的參數”更改為withStateHandlers。 它期望您傳遞初始狀態或函數以獲取初始狀態。 這樣，第二個參數便是更新狀態的函數。

請閱讀文檔： https : //github.com/acdlite/recompose/blob/master/docs/API.md#withstatehandlers

另外，如果您真的想了解高階功能/組件是如何工作的，我認為您應該嘗試創建自己的HOF / HOC。 我敢肯定，互聯網上有大量的文章。

希望這可以幫助。