I am trying to display images from TMDB API but my code doesn't work

Viewed 81

Below code is the function for displaying the movie's images with different categories. The browser and vs code doesn't show an error but still, I cannot get the result. help!!

  function Row({ title, fetchUrl, isLargeRow = false }) {
          const [movies, setMovies] = useState([]);
          const base_url = "https://image.tmdb.org/t/p/w500/";
        
          useEffect(() => {
            async function fetchData() {
              const request = await axios.get(fetchUrl);
              setMovies(request.data.results);
              return request;
            }
            fetchData();
          }, [fetchUrl]);
        
          //   console.log(movies);
        
          return (
            <div className="row">
              <h2>{title}</h2>
        
              {movies.map((movie) => (
                <img
                  // "https://image.tmdb.org/t/p/w500/" + movie.poster_path || movie.backdrop_path
        
                  src={
                    "${base_url}${isLargeRow ? movie.poster_path:movie.backdrop_path}"
                  }
                  alt={movie.name}
                />
              ))}
            </div>
          );
        }
        
        export default Row;

Here for this code "${base_url}${isLargeRow ? movie.poster_path:movie.backdrop_path}", I tried to replace (") with backtik(') but the vs code replace back on saving.

0 Answers
Related