WithProps vs withHandlers

Question

我一直在尋找反應重構庫，並試圖在這裏把握區別，結果是一樣的，試圖閱讀文檔，但變得更加困惑，爲什麼有兩種方法可以做同樣的事情？

const enhance = compose(
    withState('counter', 'setCounter', 0), 
    withHandlers({ 
    increment: props =>() => props.setCounter(n => n + 1), 
    decrement: props =>() => props.setCounter(n => n - 1) 
    }) 
) 

const enhance = compose(
    withState('counter', 'setCounter', 0), 
    withProps(({ setCounter }) => ({ 
    increment:() => setCounter(n => n + 1), 
    decrement:() => setCounter(n => n - 1) 
    })) 
) 

Answer 1

這主要是表現相關，如withHandlers不創建一個新的功能，每一個渲染。從related Github issue：

withProps將在每次更新時創建新的函數;在 另一方面，withHandlers將不會創建新的功能。

withHandlers當你想這些功能傳遞到shouldComponents通過比較道具 淺實現（如recompose/pure怎麼辦）等 成分是非常有用的。

Answer 2

此外，以法比安·舒爾茨的回答，請注意withProps可以用來添加任何類型的道具，而withHandlers只能添加功能。

因此，當您添加功能時，請儘可能使用withHandlers以提高性能。當你添加其他東西時，使用withProps（或者如果你想移除所有其他道具，則使用mapProps）。