generateStaticParams vs getStaticProps
Unanswered
thomasschwinn posted this in #help-forum
in getStaticProps I was able to return several props, which - as far as I can see - is not possible for generateStaticParams.
I have a website with around 1000 products, I generate my slugs in generateStaticParams and I use the slug also as a revalidation tag when I fetch the data.
I have Categories. Every products belongs to one category. Is there a way I can also use the category of a product as a revalidation tag? I cannot pass another param, so right now, I only get to know the category of the product after fetching it.
I have a website with around 1000 products, I generate my slugs in generateStaticParams and I use the slug also as a revalidation tag when I fetch the data.
I have Categories. Every products belongs to one category. Is there a way I can also use the category of a product as a revalidation tag? I cannot pass another param, so right now, I only get to know the category of the product after fetching it.
12 Replies
@thomasschwinn in getStaticProps I was able to return several props, which - as far as I can see - is not possible for generateStaticParams.
I have a website with around 1000 products, I generate my slugs in generateStaticParams and I use the slug also as a revalidation tag when I fetch the data.
I have Categories. Every products belongs to one category. Is there a way I can also use the category of a product as a revalidation tag? I cannot pass another param, so right now, I only get to know the category of the product after fetching it.
generateStaticParams and getStaticProps are not for the same thing. generateStaticParams handles the thing that getStaticPaths handles
The equivalence of getStaticProps in the app router is (statically rendered) server components
you are right, my question was wrong, of course I meant getStaticPaths vs getStaticParams
I don’t really understand your question. Can you show the pages router code that you use for this case?
export default async function Product({ params: { slug } }) {
const prodraw = await fetch("https://abcdefg.abc/api/route?slug=" + slug, {
next: { tags: [slug] },
});
const product = await prodraw.json();
const termslug= product.termslug
}
export async function generateStaticParams() {
const res = await fetch("https://abcdebf.abc/api/anotheroute");
let slugs = await res.json();
return slugs.map((slug) => {
return {
slug: slug,
};
//}
});
}
Is there a way I can pass another param from generateStaticParams that is accessible in my function to use it as a second revalidation tag?
const prodraw = await fetch("https://abcdefg.abc/api/route?slug=" + slug, {
next: { tags: [slug] },
});
const product = await prodraw.json();
const termslug= product.termslug
}
export async function generateStaticParams() {
const res = await fetch("https://abcdebf.abc/api/anotheroute");
let slugs = await res.json();
return slugs.map((slug) => {
return {
slug: slug,
};
//}
});
}
Is there a way I can pass another param from generateStaticParams that is accessible in my function to use it as a second revalidation tag?
Generate multiple dynamic segments from the child route segment.
I think this is what you are looking for
in theory yes, but I do not want another subroute, and the second key is only available when there is another subroute
Can a second fetch before the existing one works for you to get that param ?
(I mean inside the component)
I understand that and it works, but I thougt there is maybe a solution where I do not need to add another fetch