非同期処理の学習してたときに遭遇したエラー
すぐ解決はできたけどエラーまとめ中なんで残しておきます。
サンプルは下記コード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
let apiQuotes = []; // APIから引用文取得 async function getQuotes() { const apiUrl = "URL"; try { let response = await fetch(apiUrl); // レスポンスの文字列をJSONに変換 apiQuotes = response.json(); console.log(apiQuotes); } catch (error) { // エラー処理 console.log(error); } } // 初回画面起動時に呼び出す getQuotes(); |
目次
結論
APIの取得結果にもawaitが必要
下記修正後のコード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
let apiQuotes = []; // APIから引用文取得 async function getQuotes() { const apiUrl = "URL"; try { let response = await fetch(apiUrl); // レスポンスの文字列をJSONに変換 apiQuotes = await response.json(); // awaitを追加 console.log(apiQuotes); } catch (error) { // エラー処理 console.log(error); } } // 初回画面起動時に呼び出す getQuotes(); |
実務とかだとループ回したり、レスポンスチェックして値取得してから後処理入ってたから
こういうシンプルコードだとその意識が抜けてました。
コメント