按照文档: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>
)
}