Film Veritabanı Desteği

I am working with an api with movie react, I want to get the details of each movie but I don't get any results.

import React, { useEffect, useState ,useParams} from "react";
import { Routes,Route,Link } from 'react-router-dom'



//"
const Peliculas = () => {

const [popular, setPopular] = useState([]);


const fetchPopular = async  () => {
  const url =
  "
get popular movies"
  const data = await fetch(url);
    const movies = await data.json();
    setPopular(movies.results);
    //console.log(movies.results)
  };
  useEffect(() => {
    fetchPopular();
  }, []);

  return (
    <>
        <h2>pelis</h2>

        <ul>
          {popular.map(img =>
          <li key={img.id}><h3>{img.title}</h3><br/><Link to={"/detalles/"+img.id}>
           <img src={ "https://image.tmdb.org/t/p/w500"+ img.poster_path} alt={img.title}/>/</Link></li>)}          
        </ul>    
        </>
    )
  }
  const Detalle = () => {
    const [informacion , setInformacion] = useState();
    let {id} = useParams()
  const  fetchInformacion = () =>{  
      fetch('
get popular movies'+id)
        .then(response => response.json())
        .then(info => setInformacion(info))
        .catch(err => console.log(err.message))
        console.log(informacion.results)


  }
  useEffect(() => {
    fetchInformacion()

})
return (  
  <>
  { 
  informacion&&
  <section>
    <h1>{informacion.title}</h1>
    <img src={ informacion.poster_path} alt={informacion.title}/>        

    <p>Estreno :{informacion.release_date}</p>
    <p>Ranking {informacion.popularity}</p>

    <p><Link to="/">Regresar a la home</Link></p>
  </section>    
  }
  </>  
)
  }
 const App = () => (
  <>

      <Routes>
          <Route exact path="/" element={<Peliculas/>}/> 
          <Route exact path="/detalles/id" element={<Detalle/>}/>

      </Routes>        
  </>
); 

export default App;

2 yanıt (toplam 1 sayfanın 1.sayfasında)

Jump to last post

I don't understand anything about programming code.
But I think we can get more attention from someone who understands
if we add the name of the tool in the title of this conversation.

I believe you are doing something wrong. I recommend fetching your data with axios. try the way below:

import axios from 'axios'
const url = [the API]
const [data, setData] = useState()

  useEffect(()=>{
    axios.get(`${url}`)
      .then(response => {
        setData(response.data)
      })
      .catch(error => {
        console.error(error)
      })
  }, [])  

Also try to log it to check if you get the data correct. This should work properly. if you could console.log the data, then there should be no problem, the issue would be with the method you are using to show them. Best.

Bir filmi veya diziyi bulamıyor musun? Eklemek için oturum aç.

Küresel

s arama çubuğuna odaklan
p profil menüsünü aç
esc açık bir pencereyi kapat
? klavye kısayol penceresini aç

Medya sayfalarında

b geri git (veya uygulanabilirse ana ekrana)
e sayfayı düzenlemeye git

TV sezonu sayfalarında

(sağa ok) sonraki sezona git
(sol ok) önceki sezona git

TV bölüm sayfalarında

(sağa ok) sonraki bölüme git
(sol ok) önceki bölüme git

Tüm görüntü sayfalarında

a resim ekle penceresini aç

Tüm düzenleme sayfalarında

t çeviri seçiciyi aç
ctrl+ s formu gönder

Tartışma sayfalarında

n yeni tartışma oluştur
w izleme durumunu değiştir
p umumi/hususi değiştir
c kapalı/açık değiştir
a etkinliği aç
r tartışmayı yanıtla
l son yanıta git
ctrl+ enter mesajını gönder
(sağa ok) sonraki sayfa
(sol ok) önceki sayfa

Ayarlar

Bu öğeyi derecelendirmek veya bir listeye eklemek ister misiniz?

Giriş