Моя кнопка не перерисовывается при использовании await / asnc

Question

Я новичок в React Native и занимаюсь проектом в школе.Я пытаюсь воспроизвести звук с URL-адреса, используя устройство реакции-native-audio-рекордера и функцию await / aysnc.Все в порядке, пока я не захочу показать загрузчик (индикатор активности), пока пользователь ожидает загрузки аудио с url

Мое решение - создать состояние isLoading в состоянии, когда пользователь нажимает кнопку вФункция onPress. Я установлю setState для isLoading и добавлю обратный вызов для этого setState для вызова другой асинхронной функции.В этой асинхронной функции я буду использовать await для получения аудио от URL, а затем, когда ответ будет получен, я установлю для setState isLoading значение true.Однако мой компонент не перерисовывается, даже если состояние isLoading имеет значение true.Я очень тщательно проверил на componentWillUpdate, Render, componentDidUpdate.Мое состояние isLoading отлично работает, исключая мой компонент.Ниже мой код, извините за мой плохой английский.Спасибо!

    <View style={styles.parentViewStyle}
          <Button
            title='Click on me'
            onPress={()=>{     
              //set state for isloading true and call async function 
              this.setState({isLoading:true},()=>{this.play()
              });}}
          />
          //this text depends on the isLoading state.
          <Text>
            {this.state.isLoading?'is loading':'play'}
          </Text>
        </View>

     play=async()=>{
    console.log(this.state.isLoading);
    //isLoading here is true but my text shows 'playing'
    await sounder.startPlayer("https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3");
    this.setState({isLoading:false});
  }

Answer 1

Первая проблема должна заключаться в том, что вы переводите функцию в анонимное состояние и никогда не запускаете ее.Чтобы запустить функцию play(), вы можете сделать это следующим образом:

this.setState({isLoading:true});
this.play();

Вторая проблема заключается в том, что await просто не ... ждите до конца sounder.startPlayer().Вы можете увидеть это, выполнив:

console.log('START');
await sounder.startPlayer("https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3");
console.log('END');

Я не знаю, почему await не работает ... Надеюсь, это поможет вам.