Next.js Discord

Discord Forum

how to passing object data to other page by clicking in app directory?

Unanswered
Finnish Spitz posted this in #help-forum
Open in Discord
Finnish SpitzOP
So, simple... i have a card of movie which if user click it, it will navigate to detail movie page...

12 Replies

did you print your params…?
Finnish SpitzOP
i think no
my data is from MovieCard's props, and i want to use that data when user click a card, after that user will nvigateed to other page and use that data
so you didnt test at all and are are just asking
@not-milo.tsx You can't do that. Just fetch the data when you load the movie page
his example shows him sending the data as a query param. Which although janky… technically works
Ooh, missed it. That's soo lazy
@not-milo.tsx You can't do that. Just fetch the data when you load the movie page
Finnish SpitzOP
the API didnt service for detail like ...movie/id...so how i can take the details?
How are you getting them now? Where does SingleCard get its data from?
Finnish SpitzOP
const [datas, setData] = useState<string[]>([])
const [loading, setLoading] = useState(false)
const [movies, setMovies] = useState([])


useEffect(() => {
const fetchData = async() => {
setLoading(true)
await fetch("https://seleksi-sea-2023.vercel.app/api/movies")
.then(res => res.json())
.then(data => {
setData(data)
setMovies(data)
setLoading(false)
})

};

fetchData()
}, []);
//...
<div className="lg:grid-cols-4 grid-cols-1 md:grid-cols-2 grid gap-5">
{datas.map(data => {
return(<SingleCard key={data.title} image={data.poster_url} name={data.title} detail={data}/>)})}
</div>
</div>
)
}
@not-milo.tsx How are you getting them now? Where does `SingleCard` get its data from?
Finnish SpitzOP
like that sir, please
Then you can make a similar request when you load a movie page.