按下标题后退按钮时反应本机路由器通量执行保存功能答案

【问题标题】：react native router flux perform save function when header back button is pressed按下标题后退按钮时反应本机路由器通量执行保存功能
【发布时间】：2019-04-08 16:31:15
【问题描述】：

我找到了一种在您启动操作页面时执行此操作的方法，例如Actions.Home({onBack: () => console.log('自定义返回回调') });但是我不认为这对我有用。这是客户希望如何完成应用程序的屏幕模型：，其中后退按钮将用作数据输入页面的保存按钮。

我不相信我可以在启动页面时传入一个能够处理他们输入的数据的函数。

我需要处理数据并保存，然后继续返回上一页，或者如果数据无效，我想说“留下来进行更改，还是不保存就离开？” .

一旦我登陆页面并可以访问他们将使用的字段，如何提供 onBack 功能？

【问题讨论】：

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

【解决方案1】：

在 render() 方法中，您可以添加一个包含返回按钮的导航栏，当单击该返回按钮时，会调用 'onTap()' 函数，然后您可以在 onTap() 函数中编写任何您想要的内容.要返回，可以使用 Actions.pop() 方法。

所以你可以像处理数据一样做 Actions.pop() else do something else.

【讨论】：

【解决方案2】：

我找到了（或至少 a）方法来做到这一点。在 componentDidMount 中，您想要刷新页面并提供 onBack 函数，因为您可以访问它：

componentDidMount() {
    setTimeout(()=> {
        Actions.refresh({onBack:()=>this.onBack()})
    });
}

编辑：在将 RNRF 更新到 4.1.0-beta.8 后，谷歌把我带回了这里（如果你愿意，可以插入 Thanos meme），发现上面的代码似乎没有执行。修复方法是从 react-native 导入 InteractionManager 并将其包装在旧代码周围，如下所示：

componentDidMount() {

        InteractionManager.runAfterInteractions(()=> {
            Actions.refresh({onBack:()=>{
                this.props.handleReturnedImage({ uri: this.state.uri });
                Actions.pop();
            }});
        })

    }

【讨论】：