How can I use a custom block inside another custom block?
I have created a custom block(Block A) that works fine.
Now I am creating another custom block(Block B) and want to embed the Block A inside it.
I tried to use the InnerBlocks like this
<InnerBlocks
defaultBlock={[
"Block A"
]}
directInsert
/>
but it doesn't work.
Finally,I have found a solution. I can pass my custom block to the InnerBlocks inside a template prop.
const TEMPLATE = [
[
"core/columns",
{},
[
[
"core/column",
{},
[["custom/Block A", { url: "this is a url" }]],
],
[
"core/column",
{},
[["core/paragraph", { placeholder: "Enter side content..." }]],
],
],
],
];
<InnerBlocks template={TEMPLATE} />