反应：MovieDB API 不会显示电影海报

Question

我正在构建一个显示来自 MovieDB API 的电影及其标题的应用程序。现在我正在根据我传入的道具显示所有内容

<div className="movies">
    {movies.map(movie => (
      <Movies

        key={movie.id}
        title={movie.title}
        popularity={movie.popularity}
        release_date={movie.release_date}
        image={movie.poster_path}
      />
    ))}

   </div>

和我的组件

export default function Movies({title, popularity, release_date, image}) {
    return (
        <div className="movies-items">
            <h1>{title}</h1>
            <img src={image} alt = ""></img>
            <p>{popularity}</p>
            <p>{release_date}</p>

        </div>
    )
}

但是电影海报仍然没有出现。不确定这是否与我的代码或 API 的问题有关

Answer 1

试试：

export default function Movies({title, popularity, release_date, image}) {
    return (
        <div className="movies-items">
            <h1>{title}</h1>
            <img src={"https://image.tmdb.org/t/p/w500/"+image} alt = ""></img>
            <p>{popularity}</p>
            <p>{release_date}</p>
        </div>
    )
}