需要在反应导航中设置默认道具

Question

我想做什么

我在本机中使用tabNavigator来创建一个用户可以滚动帖子的应用。我正在尝试添加第二个标签以对帖子发表评论，因此用户可以按一个帖子，然后转到第二个标签，他们可以在那里看到评论。

我的问题

我设置了一些代码，以便当用户按下第一个标签上的帖子上的按钮时，我将它们导航到第二个标签，然后将该帖子的密钥传递给第二个标签：

onPress={() => { this.props.navigation.navigate('CommentScreen',{postKey: item.key}) }}   

然后在我的第二个标签上，应用获取此信息并将其显示在文本组件中：

接收数据：

render() {
const { params } = this.props.navigation.state;
  return (

比以后呈现它：

<Text>
  {params.postKey}
</Text>

所有这些都按预期工作，除了我第一次打开应用程序时出错。如果我关闭错误然后按意图使用该应用程序，则会显示该密钥。错误：

undefined is not an object (evaluating 'params.postKey')

我知道我需要将默认设置为某些内容，但我不知道如何操作。我希望得到一些默认定义的帮助。

Answer 1

您收到错误，因为尚未定义params。因此，您只需更改

即可消除错误

<Text>
  {params.postKey}
</Text>

到

<Text>
  {params && params.postKey}
</Text>

这基本上说，“如果定义params，则输出params.postKey”。

但老实说，听起来你正在使用错误的UX组件。移动应用标签通常用于不同的独立类别，通常不相互依赖。如果我正确理解你，那么这份工作的正确工具就是StackNavigator。这通常在您呈现项目列表（您的案例中的帖子）时使用，然后想要导航到有关该列表项目的更多详细信息（在您的案例中为评论）。您可以将StackNavigator嵌套在“帖子”选项卡中。