Реагируйте на Native Stacknavigator, запустите код, прежде чем вернуться - PullRequest
0 голосов
/ 26 августа 2018

Скажем, есть два экрана: screenA, screenB; они управляются с помощью StackNavigator.

Пользователь нажимает кнопку на экране A, которая перемещает пользователя на экран B. ScreenB имеет форму, где они могут редактировать свое имя, имя пользователя и многое другое. Я хочу сделать так, чтобы после того, как пользователь отредактировал свою личную информацию, отредактировав значения TextInput в screenB по умолчанию, пользователь может просто щелкнуть по кнопке в заголовке навигации или проведите пальцем влево по экрану, чтобы вернуться к экрану A.

В этом процессе возврата обратно к screenA я хочу иметь круг загрузки и не разрешать пользователю возвращаться обратно к A, пока пользователь не получит подтверждение от конечной точки API, которая редактирует личную информацию пользователя, с которой он работал.

  1. Пользователь редактирует информацию на экране B.
  2. Пользователь пытается вернуться к экрану А, нажав кнопку «Назад» в заголовке или проведя пальцем вправо.
  3. Появляется кружок загрузки, указывающий, что приложение отправило запрос в API для соответствующего редактирования их информации. В данный момент пользователь не перешел на экран A.
  4. Запрос выполнен успешно, и пользователь перенаправлен на экран A.

Чтобы я мог это сделать, мне нужно иметь возможность добавить какую-то функцию к переходу назад, которая позволяет мне делать все это. Кто-нибудь знает, как я могу это сделать?

ПРИМЕЧАНИЕ. Я уже пытался написать свою пользовательскую кнопку для кнопки, но это по-прежнему не решает проблему смахивания вправо для навигации.

1 Ответ

0 голосов
/ 26 августа 2018

Пожалуйста, предоставьте нам свой код, чтобы мы могли лучше помочь, вам нужна асинхронная функция. Примерно так:

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');
}

Используя async и await, вы говорите реагировать на ожидание завершения функции.

...