0

按照文档:react-navigation params,我基本上会做这样的事情(父母):

this.props.navigation.navigate('Details', {
  itemId: 86,
  otherParam: 'anything you want here',
});

然后传给孩子

class DetailsScreen extends React.Component {
  render() {
    const { navigation } = this.props;
    const itemId = navigation.getParam('itemId', 'NO-ID');
    const otherParam = navigation.getParam('otherParam', 'some default value');

    return ( (..omited for brevity)

编辑:我的情况是,在一个屏幕/容器中,我们启动了一个 graphql 突变,它接受一个 phoneNumber 并检索一个代码给用户。在下一个屏幕上,我需要使用用户刚刚插入的这个 phoneNumber 来触发另一个使用 phoneNumber 和代码进行身份验证的突变。我不想使用状态来做到这一点,因为反应导航上有可用的 api。

家长:

signInUser(phoneNumber: string) {
  const { navigation, sendCode } = this.props
  sendCode({ variables: { phoneNumber } }) // graphql mutation
  navigation.navigate('Authenticate', { phoneNumber }) // passing 
                                            // phoneNumber as param

}

孩子:

export const AuthenticationCodeModal = (props: NavigationScreenProps) => {
  const {navigation} = props
  const phoneNumber = navigation.getParam(phoneNumber)
  // console.log(phoneNumber)
  // I need to get phoneNumber here and pass it as props to 
  // <AuthenticationFormContainer> which will fire up auth mutation
  return(
    <View style={styles.container} >
      <AuthenticationFormContainer/>
    </View>
  )
}
4

2 回答 2

0

如果你使用 redux 来完成这样的任务会更好更有趣。Redux 有一个全局状态,可以由任何组件评估

于 2018-05-15T03:43:39.943 回答
0

原来这是 getParam 收到的值的简单语法错误,这样做解决了我的问题:

navigation.navigate('Authenticate', { phoneNumber: {phoneNumber: phoneNumber} })
于 2018-05-15T15:08:28.040 回答