如何在React中通过HOC传递静态NavigationOptions?

时间:2019-09-18 05:12:43

标签: javascript reactjs react-native react-navigation higher-order-components

我想制作一个HOC来将navigationOptions传递给传递的组件。

public void OnPhaseOne(GameControl gCon) 
{
    StartCoroutine(PhaseOneRoutine());
}

private IEnumerator PhaseOneRoutine()
    // *** EVENT CARDS ***

    // if there is only one in the sene you can simply use
    DisplayManager dMan = FindObjectOfType<DisplayManager>();
    // in general you should rather do it in Awake and only once

    // this now "blocks" until the message is completed
    yield return dMan.DoDisplayRoutine("Take 2 Cards, update Red Count");

    // Check for 6+ Event Cards
    if (gCon.Cards >= 6) {
        yield return dMan.DoDisplayRoutine("Discard a Card\n Discard Order:\n1. 2. 3. 4.");
    }

    // Allow for Exchange
    if (gCon.Cards == 2) {
        yield return dMan.DoDisplayRoutine("Exchange Card as Required");
    }
}

但是静态选项未分配给返回的组件。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

将navigationOptions传递给呈现的组件的正确方法是将其作为道具传递。

const withNavigationOptions = Component => ({ ...props }) => {
  const ComponentWithNavigation = Component;
  const navigationOptions = ({ navigation }) => {
    const { title } = navigation.state.params;
    return {
      header: (
        <Navbar
          navigation={navigation}
          title={title}
          onBackPress={() => navigation.navigate('Dashboard')}
        />
      )
    };
  };

  return <ComponentWithNavigation {...props} navigationOptions={navigationOptions} />;
};

export default withNavigationOptions;

在您的情况下,未将静态选项提供给返回的组件,因为您将其添加到了呈现的组件而不是返回的功能组件上。