Question

我必须从前一个组件访问对象才能在当前组件中显示。我正在尝试发送状态参数作为导航方法的第二个参数。

this.props.navigation.navigate('detail', { objPass: this.state.stObjPass });

尝试访问显示为“未定义”的当前组件的值

   async componentWillMount() {
   console.log(this.props.state.params.objPass);
   console.log(this.props.objPass);
   console.log(this.props.state.objPass);
    }

所有这些都返回空或未定义。

请告诉我如何分享对象。

Answer 1

它是this.props.navigation.state.params.objPass，因此您的参考文献不正确。

Answer 2

我认为问题出在本声明中。

this.props.navigation.navigate('detail', { objPass: this.state.stObjPass });

请检查this.state.stObjPass是否正确，并检查控制台中的键值对。

console.log(this.props.navigation.state.params);

Answer 3

当您使用导航传递参数时，您需要从导航中获取这些参数：

this.props.navigation.state.params.objPass

Read more from here

Answer 4

通常我们这样做：

onClickMore = (user) => {
    this.props.navigation.navigate('Details', { ...user });
};

然后在我们需要它的组件中，我们从navigation加载，如：

const { picture, name, email, phone, login, dob, location } = this.props.navigation.state.params;

注意：请参阅我使用了扩展运算符...这是es6语法来传递对象，还看到我如何使用this.props.navigation.state.params导入/读取目标组件然后对其进行解构。还有其他方法可以编写相同的语法。

this.props.navigation在任何正在呈现的组件中可用 - 直接由React Navigation （请参阅documentation here）

现在，navigation正在像桥一样传递数据并以某种方式获取数据，同时进行屏幕转换。（见documentation here

有关详细信息，请参阅此文章（这可能会有所帮助）： https://hackernoon.com/getting-started-with-react-navigation-the-navigation-solution-for-react-native-ea3f4bd786a4

几个检查点：

在将函数传递给navigation之前，检查函数中是否有有效对象。
在为其他组件/屏幕传递数据之前，您有this.props.navigation的有效引用。
在目标组件/屏幕中，检查您是否有对this.props.navigation.state的有效引用。

您可以使用console.log()函数调试所有这些。

此外，如果您在执行上述调试后在Git上传代码会更有帮助，因此您会得到适当的响应。问题可能在其他地方。

从其他组件访问数据-React Native

4 个答案: