javascript - 是否可以重命名 Recompose HOC（以获得更好的堆栈跟踪）？

Question

我喜欢recompose，但是当我使用它时，我会看到堆栈跟踪，其中包含以下行：

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

有什么方法可以为各个 HOC 组件提供某种“显示名称”以获得更具可读性的堆栈跟踪？

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 组件的糟糕嵌套问题。

作为一个令人愉快的补充，基准测试显示它比recompose.