使用Hooks复制功能性HOC组件，复制静态方法

Question

我有一个使用钩子的功能性HOC组件。

我正在使用Wix Native Navigation，我的大部分屏幕都使用静态方法。

但是在使用HOC时不会复制静态方法：

但是，当您将HOC应用于组件时，原始组件将使用容器组件进行包装。这意味着新组件没有原始组件的任何静态方法。

我试图使用hoistNonReactStatic但没有成功：

这是我的HOC：

const WithOfflineAlertContainer = WrappedComponent => (props) => {
  const isConnected = useNetInfo();
  return hoistNonReactStatics(
    <Fragment>
      <WrappedComponent {...props} />
      {!isConnected && <OfflineAlert />}
    </Fragment>, WrappedComponent,
  );
};

这是如何使用hoc与wix-react-native-navigation：

  Navigation.registerComponentWithRedux(screens.gallery, () => WithOfflineAlert(Gallery), Provider, store);

但它似乎没有用，因为我没有看到从static options()的wix native navigation应用的样式

Answer 1

所以我设法使用另一篇文章中的answer使其工作。

这是工作版本

const WithOfflineAlert = (Component) => {
  const WrappedComponent = (props) => {
    const isConnected = useNetInfo();
    return (
      <Fragment>
        <Component {...props} />
        {!isConnected && <OfflineAlert />}
      </Fragment>
    );
  };
  hoistNonReactStatics(WrappedComponent, Component);
  return WrappedComponent;
}