現在以下のコードで表題のエラーが出力されます。
APIデータから特定の値を取得して画面表示を行うという単純なことを行いたいのですが、表題のエラーが出て詰まっております。
対応策があれば教えていただきたく思います。
自身で調べられた範囲ですと、APIから取得する配列(とその中のオブジェクト)の構造を型定義するとうまくいくとあったのですが、APIデータの構造上ネストが多く型定義をするのが手間なので、チェックを行わず通る方法があれば教えていただきたいです。また、APIデータをTypeScriptで扱う場合どのように型チェックを行うのが一般的なのでしょうか。
TypeScript初心者のため、ご教授いただければと思います。
よろしくお願いします。
※Vue.jsをTypeScriptで書いており、一部を抜粋しています。
TypeScript
1import apiKicker from "../ApiKicker"; 2 3let items: any[] = []; 4//APIをキック 5const apikicker = new apiKicker(xxxxx); 6await apikicker.apiKicker().then(results => { 7 //APIの結果をitemsに設定 8 items = results; 9}); 10items.forEach(e => { 11 //songTitleにitems配列の中のオブジェクトに格納された値を設定 12 this.songTitle.push(e.track.name);//★e.track.nameで表題のエラー 13});
APIから結果を取得できているところまでは確認できており、データ構造は以下の通りで(Spotify APIを使用)、配列の中にオブジェクトが複数格納されているもので、オブジェクトがネストしているものもあります。
[
0:
{added_at: "2018-12-15T07:35:03Z"
added_by: {external_urls: {…}, href: "https://api.spotify.com/v1/users/XXXX",
id: "XXXX", type: "user", uri: "spotify:user:XXXX"}
track: {album: {…}, artists: Array(1), available_markets: Array(1), disc_number: 1,
duration_ms: XXXX, …}
video_thumbnail: {url: null}
}
1:{0と同様の構造}
2:{0と同様の構造}
]
回答1件
あなたの回答
tips
プレビュー