Question

我完全不了解本地人，这一部分使我感到困惑。抱歉，这个问题有点基本，但是我很难在本地反应问题上找到答案。

所以我有两个页面（屏幕）：

第一个屏幕（主页）是空的。
在第二个屏幕（添加屏幕）中，有人员列表。您可以从列表中选择一个，它将被添加到第一个屏幕。
这就是我到目前为止所做的，我创建了一个 global 变量来容纳所有人。

global.allPerson = '';
在第一个屏幕中，我将 getParam 用作第二个屏幕的参数接收器（如果存在），然后将其压缩为全局变量。

const { navigation } = this.props; const personName = navigation.getParam('personName', ''); global.allPerson += "\n" + personName;
在第二个屏幕上，我将 parameter 传递给第一个屏幕

<TouchableHighlight onPress={() => this.props.navigation.navigate('Home', { peopleName: 'Eric' })}><Text>Add This Person</Text></TouchableHighlight>

这有效，但是每次我单击第二个屏幕的链接时，显然global.allPerson += "\n" + personName;再次被触发。

因此，假设我选择“ Eric”，然后选择“ Michael”，它变成“ Eric Eric Michael”。

我也尝试使用状态，但是它不是持久性的，只会显示最后选择的状态。

在这一点上，我不确定创建这样的东西的正确方法，有人可以告诉我正确的方法吗？谢谢！

Answer 1

以下是我如何使用StackNavigator解决此问题的示例：

主页

<Button onPress={() => {
    this.props.navigation.navigate('Settings', {previousState: this})
}}>
    Some text
</Button>

设置页面

componentWillUnmount() {
   this.props.navigation.state.params.previousState.setState({
     data: 'Some data I'm passing back to the previous state'
   });
}

这并不需要在componentWillUnmount()上进行，您可以随时随地通过任何功能触发此操作。我的用例恰好是当我卸载（返回）您可以使用的上一个组件时：

this.props.navigation.goBack(null)

因此，您可以在调用goBack之前重置以前的状态。

希望这很有道理。

反应导航-如何在屏幕之间重复传递数据？

1 个答案: