I have a page with the a BuilderContent component.
<BuilderContent
model="blog-article"
content={blogArticle}>
{(data) => (
<>
{data.title}
<ChildComponent description={data.description} />
</>
)}
</BuilderContent>
And while data.title rerenders perfectly fine while previewing/editing within builder. However, the ChildComponent remains fixed.
Any one have suggestions?
Hello @brucewyne,
Could you please share your ChildComponent code? We tested it on our end and did not encounter any issues. Custom components inside seem to render correctly.
<Box sx={{ flexGrow: 1 }}>
<Grid container spacing={2}>
<Grid xs={12}>
<BuilderContent
content={article}
options={{ includeRefs: true }}
model="blog-article"
>
{(data, loading, fullContent) => (
<React.Fragment>
<Head>
{/* Render meta tags from custom field */}
<title>{data?.title}</title>
<meta name="description" content={data?.blurb} />
<meta name="og:image" content={data?.image} />
</Head>
<div>
<div>{data?.title}</div>
{/* Render custom component */}
<TextField id="outlined-basic" label={data?.title} variant="outlined" />
{/* Render the Builder drag/drop'd content */}
<BuilderComponent
name="blog-article"
content={fullContent}
options={{ includeRefs: true }}
data={{ article }}
/>
</div>
</React.Fragment>
)}
</BuilderContent>
</Grid>
</Grid>
</Box>
Yeah - nevermind this was on me. The props I was passing to components were nested refs. Thankfully as part of your response, you showed me how to include them! Happy accidents!
