web-dev-qa-db-fra.com

Fonction sommeil pour React-Native?

J'essaie donc de récupérer tous les "lieux" étant donné leur emplacement dans React Native via l'API Google Places. Le problème est qu'après avoir effectué le premier appel à l'API, Google ne renvoie que 20 entrées , puis renvoie un next_page_token, à ajouter au même appel d'API url. Donc, je fais une autre demande pour obtenir les 20 prochains emplacements juste après, mais il y a un petit délai (1-3 secondes) jusqu'à ce que le jeton devienne réellement valide, donc ma demande est erronée.

J'ai essayé de faire:

this.setTimeout(() => {this.setState({timePassed: true})}, 3000);

Mais il est complètement ignoré par l'application ... des suggestions?

Mise à jour

Je le fais dans ma fonction componentWillMount (après avoir bien sûr défini les variables), et j'appelle le setTimeout juste après cette ligne.

axios.get(baseUrl)
.then((response) => {
   this.setState({places: response.data.results, nextPageToken: response.data.next_page_token });

});
javascriptandroidgoogle-mapsreactjsreact-native
6
user6483984

Ce que j'ai compris, c'est que vous essayez de faire une extraction basée sur le résultat d'une autre extraction. Donc, votre solution consiste à utiliser un TimeOut pour deviner quand la demande se terminera et ensuite faire une autre demande, non?

Si oui, ce n'est peut-être pas la meilleure solution à votre problème. Mais le code suivant explique comment utiliser les délais d'attente:

// Without "this"
setTimeout(someMethod,
    2000
)

L'approche que je prendrais est d'attendre la fin de la récupération, puis j'utiliserais à nouveau le rappel pour la même récupération avec des paramètres différents, dans votre cas, le nextPageToken. Je le fais en utilisant la syntaxe asynchrone & wait ES7.

// Remember to add some stop condition on this recursive method.
async fetchData(nextPageToken){
    try {
        var result = await fetch(URL)
        // Do whatever you want with this result, including getting the next token or updating the UI (via setting the State)
        fetchData(result.nextPageToken)
    } catch(e){
         // Show an error message
    }
}

Si j'ai mal compris quelque chose ou si vous avez des questions, n'hésitez pas à demander!

J'espère que ça aide.

9
Gui Herzog

essayez ça a fonctionné pour moi:

  async componentDidMount() {
     const data = await this.performTimeConsumingTask();

        if (data !== null) {
       // alert('Moved to next Screen here');
    this.props.navigator.Push({
        screen:"Project1.AuthScreen"})
        }
  }
  performTimeConsumingTask = async() => {
    return new Promise((resolve) =>
      setTimeout(
        () => { resolve('result') },
        3000
      )
    );
  }
3
Khushboo Tahir