如何通过 react-native-router -flux 在 react-native 中更新回（上一个）屏幕答案

【问题标题】：How to update back(previous) screen in react-native by react-native-router -flux如何通过 react-native-router -flux 在 react-native 中更新回（上一个）屏幕
【发布时间】：2018-10-05 11:23:21
【问题描述】：

我在我的应用程序中使用 react-native-router-flux。

-我在我的第一个屏幕上使用一个参数，然后我导航到第二个屏幕。

-在第二个屏幕上，我正在更新我在第一个屏幕上使用的参数。

-我希望在导航回该屏幕（第一个屏幕）时更新它。

我怎样才能实现这个功能。

谢谢

【问题讨论】：

在视图之间共享数据...也许使用 Redux ？
@Vinzzz 我没有使用 Redux，那么？
到目前为止你尝试了什么？
@Vinzzz 你能建议一下，我该怎么办？

标签： react-native react-native-router-flux

【解决方案1】：

@Vinzzz 是正确的最佳解决方案是使用 redux。但是，如果没有它，您如何才能完成这项工作。

当您导航到另一个视图时，您调用 action.OTHER_VIEW()

您可以将参数传递给该函数，该参数将通过与您的键对应的组件中的道具获得：“OTHER_VIEW”

这里是一个例子：

routeA.js

constructor(props){
  super(props);
  var _data = this.props.dataFromRouteB || "";
  this.state = {
    data : _data
  };
}

onPress(){
  action.ROUTE_B({dataFromRouteA: this.state.data}); // navigate to route B
}

render(){
  const {data} = {...this.state};
  return(
    <View>
      <Text>{data}</Text>
      <Button title="go to route B" onPress={()=> this.onPress()} />
    </View>
  );
}

routeB.js

componentDidMount(){
  var a = this.props.dataFromRouteA; // a = ""
  a = "hello";
  action.ROUTE_A({dataFromRouteB:a}); // navigate to ROUTE_A , data will be available via  props
}

【讨论】：

不错！虽然，根据您如何构建从 A 到 B 的导航，在显示 B 时可能不会卸载 A，不是吗？
我可以使用反应生命周期方法吗？如果是，请建议我应该使用哪一个？
Vinzzz，我不知道导航是如何在这个库中实现的。 @Kailash 你能说得更具体点吗？你想在生命周期方法中做什么？调用 action.ROUTE_X() ?
@DanielGabor，我正在实现聊天功能，我想更新消息未读计数，因为我将从消息阅读屏幕导航回来。
我知道你在做什么，我建议你在需要在组件之间共享数据时使用 redux，它会简单得多

【解决方案2】：

我在不使用 Redux 的情况下解决了这个问题。

将 Screen First 的 api 调用语句放入一个方法中（在 First Screen 上）并传递给第二个屏幕。在第二个屏幕上，我在 componentWillUnmount() 中调用了这个方法。它正在更新我的第一个屏幕，因为我将从第二个屏幕返回。

【讨论】：