質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

4回答

1063閲覧

Javascript promiseの経過時間に応じて処理を分けたい

yochun02

総合スコア76

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/10/05 06:39

APIを叩いたあと、その結果を取得する時にかかった時間に応じて処理を入れたいのですが何か方法はありますか?

以下の例では、レスポンスに5秒以上にかかった場合のデータ取得中にローディング画面を表示したい等を想定しています。

typescript

1 2export async function handling<T>(fetchData: Promise<T>, dispatch: Dispatch<{}>){ 3 const response = await fetchData; 4 if(time > 5000) dispatch(...) // responseの待ちに5秒以上たったらの処理 5 return response; 6} 7

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Lhankor_Mhy

2021/10/05 06:42

そのコードですと、ロードが終わった後にローディング画面が出ることになると思いますが、そういうことではないですよね?
yochun02

2021/10/22 05:09

返信が遅れてしまい申し訳ありません。 そうですね。タイミングとしてはapiを叩いた後、数秒後(今回の場合5秒)経つまでにレスポンスが返らなかった場合にローディングを表示したままにする という感じですね。 例えば、レスポンスに1秒かかるapiを叩く場合はローディング画面を出さず、6秒かかるものはローディング画面を出したままにする(5~6秒の間)ということですね。
guest

回答4

0

5秒待ってからローディングするくらいなら最初からローディングを出せば良いと思います

投稿2021/10/05 06:47

yambejp

総合スコア116734

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

経過時間を測るのは、最初に現在日時を取得しておいて、処理後/処理中の時点の現在日時から最初の日時を引けば出てきます

投稿2021/10/05 08:33

y_waiwai

総合スコア88042

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

忘れられがちですが、Promise.raceを使ってはどうでしょうか。

Javascript

1async function handling( fetchData , dispatch ) 2{ 3 let result = await Promise.race( 4 [ 5 fetchData, 6 new Promise(resolve=>setTimeout(resolve,5000)) 7 ] ); 8 if( result != undefined )return result; 9 dispatch(); 10 return fetchData; 11}

このコードだとfetchDataがundefinedを返すと意図しない動作をするので、
undefinedを返す可能性があるならその辺は適当にコードを追加して下さい。

投稿2021/10/06 20:12

AT_2nd

総合スコア266

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yochun02

2021/10/22 05:10

ありがとうござます!
guest

0

こういうことですか?

js

1const timeoutID = setTimeout( ()=>dispatch(...), 5000) 2const response = await fetchData; 3clearTimeout(timeoutID);

投稿2021/10/05 09:15

Lhankor_Mhy

総合スコア36960

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問