Question

说有两个屏幕：screenA，screenB；这些都是使用StackNavigator进行管理的。

用户单击screenA中的一个按钮，该按钮将用户导航到screenB。 ScreenB具有一个表单，用户可以在其中编辑自己的姓名，用户名等。我要这样做，以便在用户通过编辑screenB中的TextInput的默认值来编辑其个人信息之后，用户可以单击导航标题中的后退按钮，也可以在屏幕上向左滑动以返回到screenA。

在返回screenA的过程中，我希望有一个加载圈，并且不允许用户返回A，直到用户从API端点收到确认，该确认会编辑可正常工作的用户个人信息。

用户在屏幕B上编辑信息。
用户尝试通过单击标题中的“后退”按钮或向右滑动来导航回到screenA。
出现一个加载圆圈，表明该应用已向API发送了一个请求，以相应地编辑其信息。用户此时尚未导航到screenA。
请求成功，并且用户被带到screenA。

要执行此操作，我需要能够向后导航添加某种功能，使我能够执行所有操作。有人知道我该怎么做吗？

注意：我已经开始考虑为后退按钮编写自定义按钮，但这仍然不能解决向右滑动导航的问题。

Answer 1

请向我们提供您的代码，以便我们可以提供更好的帮助，您需要的是异步函数。像这样：

async UploadInformation(username, password) {
    let response = await fetch(url,{
        method:  method,
        body:  JSON.stringify({
          'username':username},
          'password':password),
        headers: headers
    });
    return response;
}

然后在您的后退按钮中

async back_button(){
    //show your loading indicator
    let r=await UploadInformation(this.username, this.password);
    //remove your loading indicator
    this.props.navigation.navigate('A');
}

通过使用异步并等待，您可以告诉React等待功能完成其工作。

React Native Stacknavigator，在返回之前运行代码

1 个答案: