پشتیبانی پایگاه داده‌ فیلم

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 پاسخ (در صفحه 1 از 1)

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.

فیلم و نمایش تلویزیونی را نمی‌توانید پیدا کنید؟ به سیستم وارد شوید تا آن را ایجاد کنید.

Global

s تمرکز بر منوی جستجو
p منوی پروفایل باز شود
esc بستن پنجره باز
? پنجره میانبرهای صفحه‌کلید باز شود

در صفحات مدیا

b بازگشت به عقب (یا در صورت لزوم به منشا)
e برو به صفحه ویرایش

در صفحات فصل تلویزیونی

(فلش سمت راست) برو به فصل بعد
(پیکان سمت چپ) برو به نشست قبلی

در صفحات قسمت تلویزیونی

(فلش سمت راست) برو به قسمت بعد
(پیکان سمت چپ) برو به قسمت قبلی

در تمام صفحات تصویر

a پنجره افزودن تصویر باز شود

در تمام صفحات ویرایش

t انتخابگر ترجمه باز شود
ctrl+ s ثبت از

در صفحات بحث

n ایجاد بحث جدید
w تغییر وضعیت وضعیت تماشا
p تغییر وضعیت عمومی/خصوصی
c تغییر وضعیت بسته/باز
a گشایش صفحه فعالیت
r پاسخ به بحث
l برو به آخرین پاسخ
ctrl+ enter پیام خود را ثبت کنید
(فلش سمت راست) صفحه بعد
(پیکان سمت چپ) صفحه قبلی

تنظیمات

آیا می‌خواهید به این مورد امتیاز دهید یا به فهرست اضافه کنید؟

ورود