web-dev-qa-db-ja.com

React-Nativeのスリープ機能？

だから私はReact Google Places API経由でネイティブの場所を与えられたすべての「場所」を取得しようとしています。問題はAPIへの最初の呼び出しを行った後、Googleが20エントリしか返さないことです、そしてnext_page_tokenを返し、同じAPI呼び出しurlに追加されます。そのため、すぐに次の20の場所を取得するために別のリクエストを行いますが、少し遅れて（1- 3秒）トークンが実際に有効になるまで、リクエストがエラーになります。

私はやってみました：

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

しかし、それはアプリによって完全に無視されています...提案はありますか？

更新

これをcomponentWillMount関数で（もちろん変数を定義した後）行い、この行の直後にsetTimeoutを呼び出します。

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

});
javascriptandroidgoogle-mapsreactjsreact-native
6
user6483984

私が理解したのは、あなたが別のフェッチの結果に基づいてフェッチしようとしているということです。したがって、あなたの解決策は、タイムアウトがいつリクエストが終了するかを推測し、別のリクエストを行うことですよね？

はいの場合、これはあなたの問題の最善の解決策ではないかもしれません。しかし、次のコードは私がタイムアウトを使用する方法です：

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

私が取るアプローチは、フェッチが終了するまで待機することです。その後、同じフェッチへのコールバックを使用して、異なるパラメーター（あなたの場合はnextPageToken）を使用します。 ES7のasync＆await構文を使用してこれを行います。

// 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
    }
}

私が何かを誤解したり、質問がある場合は、お気軽にお問い合わせください！

役に立てば幸いです。

9
Gui Herzog

私のために働いたこれを試してください：

  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