如何在 react-native 中使用“this.props.navigation.goBack()”将数据传递到另一个屏幕？答案

【问题标题】：How to pass data into another screen with "this.props.navigation.goBack()" in react-native?如何在 react-native 中使用“this.props.navigation.goBack()”将数据传递到另一个屏幕？
【发布时间】：2020-05-06 06:16:15
【问题描述】：

我正在创建一个反应原生应用程序，现在我想在屏幕之间传递数据。如果我像这样传递数据“this.props.navigation.navigate('MyScreen1',{MyData:'Hello this is a data'})”，它会正确传递数据。但我想在 goBack() 中传递数据。如何在 react native 中使用“this.props.navigation.goBack()”方法将数据传递到另一个屏幕？

我在这里尝试过的，我将数据传递到其他屏幕的屏幕我在下面添加代码，

 this.props.navigation.goBack({MyData:'Hello this is a data'});

我添加了以下代码的数据检索屏幕，

 var myData = this.props.navigation.state.params.MyData;
 console.warn(myData );

但是这里什么都不会发生。

【问题讨论】：

标签： reactjs react-native react-native-navigation

【解决方案1】：

你必须pass a call back function while navigating to screen 并在navigation.back() 之前执行该回调函数

YourCallBackFunction=(dataFromNextScreen)=>{
 console.log('dataFromNextScreen', dataFromNextScreen)
  }


this.props.navigation.navigate('ScreenName', { YourCallBackFunction: function })

现在在您想要执行 goBack 函数的屏幕上，将数据传递给该回调函数。

this.props.navigation.state.params.YourCallBackFunction(dataToBePassed)
this.props.navigation.goBack()

Edit: 这是我为您创建的零食，进入日志并在导航返回时查看新传递的数据。

https://snack.expo.io/@waheed25/14d924

【讨论】：

如果我在屏幕 1 中添加类似这样的代码 ** {YourCallBackFunction=(dataFromNextScreen)=>{ console..log('dataFromNextScreen', dataFromNextScreen) } opencontSCR = (value1) => { if (value1 == 'Contacts') { this.props.navigation.navigate('selectContact', {YourCallBackFunction: this.YourCallBackFunction }) } }; }**
然后数据发送屏幕我添加了以下代码。 { sendData = () =>{ this.props.navigation.state.params.YourCallBackFunction({selectContactDel:'this is my data'}) this.props.navigation.goBack() }}** 这些代码可以吗?
但是这里什么都不会发生
你能在博览会上用你的代码做点心并与我分享，我会在那里修复它吗？
其实是个大工程。有很多库和代码。我可以分享完整的代码。给我一封电子邮件，我将它们发送给您。这是我的邮件“sidath.sansu@gmail.com”

【解决方案2】：

goback function 中似乎没有要发送的参数。所以你可以像你说的那样使用navigation.navigate，或者在goback函数之前尝试this.props.navigation.state.paramsset params？

【讨论】：

实际上我是 react-native 的大佬。我对反应导航没有很好的了解。如果我可以在调用函数时打开页脚选项卡屏幕，我可以像这样传递我的数据“this.props.navigation.navigate('MyScreen1',{MyData:'Hello this is a data'})”。但我无法打开页脚选项卡屏幕。如果您可以在这里查看我的项目。 [链接](github.com/SidathDananjaya/Event-App/tree/master/Event-App)