Question

我需要将状态从子屏幕传递到父屏幕。我在执行此操作时遇到困难。我让用户按下按钮以navigate进入子屏幕。在子屏幕中填写信息后，我尝试使用props.navigation.goBack()将该值传递回父屏幕。有人可以帮我吗？

我正在使用React Navigation 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

如果无法使用常规导航方式，则可以尝试构建自己的back函数并随其传递参数。

看看这个可能：

  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（）等配合使用，因为我不确定wich语法是否适合您。

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

1 个答案: