时间戳

首页 > 解决方案 > React-Navigation v4 在后按时将状态从子级传递给父级

react-native - React-Navigation v4 在后按时将状态从子级传递给父级

问题描述

我需要将状态从子屏幕传递到父屏幕。我很难做到这一点。我让用户按下一个按钮到navigate子屏幕。在子屏幕中填写信息后，我试图将值传递回父屏幕，props.navigation.goBack()有人可以帮我解决这个问题。

我正在使用反应导航 v4

父屏幕：

const Parent = (props) => {
  const [day, setDay] = useState("");

  return (
        <TouchableOpacity
            onPress={() =>props.navigation.navigate({ routeName: 'Child' })}>
        </TouchableOpacity>
  );
};

子屏幕（我想将day状态传回给父屏幕）

const Child = props => {
    const [day, setDay] = useState("");
  return (
    <View style={styles.container}>
      <TextInput onChange={(text)=> setDay(text)}/>
      <Button onPress={()=>props.navigation.goBack()}/>
    </View>
  );
};

标签： react-nativereact-hooksreact-native-androidreact-navigation

解决方案

如果无法使用正常的导航方式，可以尝试构建自己的后退函数并传递参数。

看看这个也许：

  goBack() {
    const { navigation } = this.props;
    navigation.goBack();
    navigation.setParam({ day: dayData});
  }

那么电话将是：

<Button onPress={()=>this.goBack()}/>

你可以得到参数：

this.props.navigation.getParam("day")

以某种方式尝试这样 - 如果它不起作用，请尝试使用 this.props.navigation... 或仅使用 navigation.goBack() 等调用，因为我不确定哪种语法对你有用。

推荐阅读