0

I using the InnerBlocks tag to allow for nested blocks, within my custom block. I am trying to use the 'allowedBlocks' argument to restrict the blocks allowed to only specific ones. However, if I put anything inside the InnerBlocks tag, the block does not load and just spins.

I am using acf_register_block for my block registry, as what we are doing heavily ties in with ACF. I have enabled '__experimental_jsx' => true in all the blocks I am working with.

This works

<div>
    <InnerBlocks />
</div>

This does not work

<div>
    <InnerBlocks allowedBlocks={ 'acf/orange-carousel' } />
</div>

It also doesn't work if I pass an array instead of a string for the allowed blocks.

I am using ACF Pro Beta 5.9

Any help is appreciated!

0

Is acf the correct namespace? if so, this should work in your edit function.

const ALLOWED_BLOCKS = [
    'acf/orange-carousel',
]

return (
    <div className={className}>
        <InnerBlocks
            allowedBlocks={ ALLOWED_BLOCKS }
        />
    </div>
);
| improve this answer | |
  • Yea it should be, that's what the block is registered as. Also, can you clarify what you mean by "edit function"? Keep in mind I am using ACF to register these blocks. acf_register_block – Leathel Jun 1 at 19:06
  • Sorry i missed that. My thought process on this was to use @wordpress/create-block and write a new block, then call your acf block using InnerBlocks there. – Garrett Jun 2 at 20:08
  • Interesting, Il give it a try – Leathel Jun 2 at 20:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.