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

Question

我需要将状态从我的子屏幕传递到父屏幕。我很难做到这一点。我让用户按一个按钮 navigate 到子屏幕。在子屏幕中填写信息后，我试图通过 props.navigation.goBack() 将值传回父屏幕 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>
  );
};

Answer 1

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

看看这个也许：

  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() 等等，因为我不确定哪种语法适合你。

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

React-Navigation v4 pass state from child to parent on back press

react-native

react-native-android

react-navigation

react-hooks