React Native:初始化为组件时,navigationOptions在单个屏幕上停止工作

时间:2019-05-01 01:35:41

标签: react-native react-navigation

如果我创建了一个允许发送道具的导航堆栈,则各个屏幕组件内的navigationOptions将不再起作用。我如何既可以在创建道具之前将其发送到屏幕,又可以控制每个屏幕内部的navigationOptions

例如:

const DefaultNavigator = propToPass => createStackNavigator(
  {
    First: { screen: props => <First {...props} propToPass={propToPass} /> },
    ...otherScreens,
  },
  navOptions
);

const AlternateNavigator = propToPass => createStackNavigator(
  {
    First: { screen: props => <AltFirst {...props} propToPass={propToPass} /> },
    ...otherScreens,
  },
  navOptions
);

class NavWrapper extends React.Component {
  render() {
    const { someProp, anotherProp} = this.props
    if (something){
      const ModifiedNavWithProp = AlternateNavigator(someProp);
      return <ModifiedNavWithProp />
    }else {
      const ModifiedDefaultNavWithProp = DefaultNavigator(anotherProp);
      return <ModifiedDefaultNavWithProp />
    }
  }
}

export default NavWrapper

class First extends React.Component {
  static navigationOptions = ({ navigation }) => {
    console.log("navigation doesn't log here!", navigation)
    return {...navigationOptions};
  }
  render(){/****/}
}

我可以通过将navigationOptions更改为以下内容来修复First屏幕内的DefaultNavigator,但是我不确定如何传递道具。

const DefaultNavigator = propToPass => createStackNavigator(
  {
    First: { screen: First },
    ...otherScreens,
  },
  navOptions
);

我目前正在使用反应导航v2.17.0

0 个答案:

没有答案