IMG SRC在ReactJ中不响应

Question

的行。

    import React, { useEffect, useState } from 'react';
import axios from './axios';
const base_URL="https://image.tmdb.org/t/p/original";
function Row({title,fetchUrl}) {
    const [movies,setMovies]=useState([]);
    useEffect(()=>{
        async function fetchData(){
            const request=await axios.get(fetchUrl);
            console.log(request);
            setMovies(request.data.results);
            return request;
        }
        fetchData();
    },[fetchUrl]);
  return (
    <div className="row">
    <h2>{title}</h2>
    <div className="row__posters">
    {movies.map(movie=>{
        console.log(movie);
        <img src={'${base_URL}${movie.poster_path}'} alt={movie.name}/>
    })}
    </div>
    </div>
  )
}
export default Row

这是我 “ part

Answer 1

您需要返回图像：

<div className="row__posters">
{movies.map(movie=>{
    console.log(movie);
    return <img src={'${base_URL}${movie.poster_path}'} alt={movie.name}/>
})}
</div>

Answer 2

您仅映射电影对象而不是返回。因此，请尝试以下操作：

{movies.map((movie,index)=>{
    console.log(movie);
   return ( <img key={index} src={'${base_URL}${movie.poster_path}'} alt={movie.name}/>)
})}

在此处，还使用键= {index}在img tag中。它给出了每个IMG标签的唯一键。