我正在從 TMDb API 獲取一些資訊,并使用 InnerHTML 在螢屏上顯示它,但是我在嘗試顯示電影的型別名稱時遇到了麻煩,因為它們存盤在陣列中。我想展示所有型別,有些電影不止一種。
這是我的代碼片段(第一次使用 JavaScript):
//TMDB INTEGRATION - API KEY
const API_KEY = 'api_key=APIKEYNUMBER';
const BASE_URL = 'https://api.themoviedb.org/3/';
const API_LANGUAGE = '&language=pt-BR';
var ID = '299536';
const API_MOVIE = BASE_URL 'movie/' ID '?' API_KEY API_LANGUAGE;
const overviewfilme = document.getElementById('overviewfilme');
detalheFilme(API_MOVIE);
function detalheFilme(url) {
fetch(url)
.then(res => res.json())
.then(data => document.getElementById("colunaesquerda").innerHTML =
`
<h3 id="nomedofilme">${data.title}</h3>
<h5 style="font-style: italic">${data.original_title}</h5>
<table>
<tr>
<td style="padding-right: 10px;">
<h6>${data.release_date}</h6>
</td>
<td style="padding-right: 10px;">
<h6>${data.genres[0].name}</h6> //THE SPECIFIC LINE
</td>
<td style="padding-right: 10px;">
<h6>${data.runtime} mins</h6>
</td>
</tr>
目前我正在使用陣列的索引,所以我只得到第一個型別的節目。我使用過 data.genres.join() 和 data.genres.join.toString(),但大部分時間我得到的是 [object Object]、[object Object]、[object Object](在這個例子中,這部電影分為三種型別)。
有人可以幫助顯示陣列的所有內容嗎?
謝謝!
uj5u.com熱心網友回復:
您的連接不起作用,因為您需要name從可以map()使用的流派陣列中的每個物件中提取,然后使用join().
就像是:
<h6>${data.genres.map(o => o.name).join(', ')}</h6>
uj5u.com熱心網友回復:
正如我所看到的,回應有一系列型別的物件。您需要提取流派的名稱。您可以使用Array.map來提取名稱。
fetch(url)
.then((res) => res.json())
.then(
(data) =>
(document.getElementById("colunaesquerda").innerHTML = `
<h3 id="nomedofilme">${data.title}</h3>
<h5 style="font-style: italic">${data.original_title}</h5>
<table>
<tr>
<td style="padding-right: 10px;">
<h6>${data.release_date}</h6>
</td>
<td style="padding-right: 10px;">
<h6>${data.genres.map(({name}) => name).join(", ")}</h6> //THE SPECIFIC LINE
</td>
<td style="padding-right: 10px;">
<h6>${data.runtime} mins</h6>
</td>
</tr>`)
);
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/321530.html
標籤:javascript html 数组 接口 内页
上一篇:陣列字串中有多少這個單詞
