Answer the question
In order to leave comments, you need to log in
How to work with the getStaticProps Next.js function (on my example)?
next.js. As far as I understand, getStaticProps is launched during assembly, inside we get the necessary data, cache it and return this data. When you run this function again, we simply give the data from the cache. Do I understand the algorithm correctly?
If so, then the question is.
There is a products page with all products
export default function Products({ products }) {
const router = useRouter();
return ( ... выводим список товаров )
}
export async function getStaticProps() {
const response = await fetch('http://localhost:3000/api/products');
const products = await response.json();
return { props: {products} };
}
export default function Product({product}){
return( ... выводим конкретный товар )
}
export async function getStaticPaths() {
const res = await fetch('http://localhost:3000/api/products')
const products = await res.json()
const paths = products.map((product) => `/product/${product.id}`)
return { paths, fallback: false }
}
export async function getStaticProps({ params }) {
const res = await fetch(`http://localhost:3000/api/products/${params.id}`)
const product = await res.json()
return { props: { product } }
}
<Modal
isOpen={!!router.query.id}
как сюда передать данные товара на который кликнули?
>
здесь данные товара на который кликнули
</Modal>
Answer the question
In order to leave comments, you need to log in
getStaticProps - needed to create statics, not caching. getStaticProps is needed to create the final html file.
Send all the necessary data to the madal window props yourself.
You wrapped getStaticProps in getStaticPaths and export it, maybe you don't need it like this :)
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question