Реагировать на функциональный компонент HOC с помощью хуков, копируя статические методы

У меня есть функциональный компонент HOC, который использует хуки.

Я использую встроенную навигацию Wix, и большая часть моего экрана использует статические методы.

Но статические методы не копируются при использовании 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


react-hooks higher-order-functions wix-react-native-navigation
person Kevin Amiranoff    schedule 28.04.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Так что мне удалось заставить его работать, используя этот ответ из другого сообщения.

Вот рабочая версия

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