是否可以重命名 Recompose HOC（为了更好的堆栈跟踪）？

Question

我喜欢 recompose，但是当我使用它时，我最终得到的堆栈跟踪包含以下行：

in withProps(withHandlers(withHandlers(SelectionOverlay))) (created by withState(withProps(withHandlers(withHandlers(SelectionOverlay)))))

有什么方法可以为各个 HOC 组件提供某种 "display name" 以获得更具可读性的堆栈跟踪？

Answer 1

查看此部分： https://github.com/acdlite/recompose#build-your-own-libraries

我相信您可以为名为 displayName 的组件分配一个静态 属性，它将传递给堆栈跟踪以及 React chrome 扩展。

所以如果你的 HOC 是这样组成的，你可以这样写：

const MyComponent = withProps(withHandlers(withHandlers(SelectionOverlay)))

MyComponent.displayName = "ArbitraryValue"

Answer 2

有一种 setDisplayName 方法似乎可以满足您的要求 - https://github.com/acdlite/recompose/blob/master/docs/API.md#setdisplayname

Answer 3

与其到处使用 setDisplayName，您可能想尝试 recompact，它旨在准确解决 recomposeed 组件的可怕嵌套问题。

作为一个令人愉快的补充，benchmarks 表明它比 recompose 快一点。