react 高阶组件(HOC)返回的组件在react-developer tools 显示unKnown？

Question

const withLoading = Component => ({ isLoading, ...rest }) =>
    isLoading ? <Loading /> : <Component { ...rest } />
const ButtonWithLoading = withLoading(Button)

render里：

<ButtonWithLoading isLoading={false}>
    More
</ButtonWithLoading>

结果：页面展示效果正常 但tools里有异常 详见下图

Answer 1

你返回的是个匿名Stateless Component

试一下

const withLoading = Component => function CustomComp({ isLoading, ...rest }) {
  return isLoading ? <Loading /> : <Component { ...rest } />
}