Please fill out as many of the following questions as possible so we can help you promptly! If you don’t know how to answer or it does not apply, feel free to remove it or leave it blank.
Builder content link
e.g. Builder.io: Visual Development Platform
Builder.io: Visual Development Platform
Builder public api key
go to Builder.io: Visual Development Platform and copy your PUBLIC api key
e2f096ba17f74dfd9c140ac050f349a4
What are you trying to accomplish
e.g. I want to integrate builder on a landing page
When using the NextJS Link component with the pages router, I want the BuilderContent component to update appropriately. Currently, it does not update when I change within the same page; i.e. I go from /blog/post-1 to /blog/post-2 and getStaticParams returns correctly the data for post-2 but BuilderContent keeps the content from post-1.
If I hard refresh the page, it returns the correct data populated from getStaticProps but with the SPA routing once the NextJS app loads, its not.
Code stack you are integrating Builder with
e.g. NextJS, react, Shopify
NextJS
Reproducible code example
If you are having integration errors, please link to codesandbox or copy and paste your problematic code here. The more detail the better!
I left some comments using the post example above and where data is returned correctly and incorrectly.
console.log('article', article); // This is logging correct data, i.e. `post-2` data
return (
// Wrapping the structured data in BuilderContent allows
// it to update in real time as your custom fields are edited in the
// Visual Editor
<BuilderContent
content={article}
options={{
options: {
includeRefs: true,
includeUnpublished: true,
},
enrich: true,
// userAttributes: {
// urlPath: `/blog-v2/${article.slug}`,
// },
query: {
data: {
slug: router.query.slug,
},
},
}}
model="blog-article"
>
{(resolvedData, loading, fullData) => {
if (loading) return;
// console.log('fullData', fullData);
// console.log('resolvedData', resolvedData);
// console.log('isPreviewing', isPreviewing);
const data = resolvedData;
console.log('data', data, fullData); // This is logging old data i.e. post-1 data
}
...