custom taxonomy – Gutenberg Block Editor – Create block with dynamic content


The official docs has a example of creating a demo block.

The example has an edit.js and save.js for creating an editor view and front end view.

Assuming I want to create a block that prints a list of custom taxonomies. I can create the block, the content will save and display on the front end.

The issue is that if an item will be added to that custom taxonomies, it won’t be shown unless I remove the block and add it back again because the custom taxonomy list is saved as part of the block content.

If we look how the default WordPress categories block works wp-content/blocks/categories.php, seems like it’s not rendered from React at all. In the post only something like this is saved <!-- wp:categories {"displayAsDropdown":true} /-->, and the content is rendered dynamically from php, including the js “onChange” function.

I need to add some logic and functionality with React to my custom block, so creating a block the same way the core categories block is won’t work for me.

How can I print a block with dynamic content in a similar way the core categories work, but with React JS similar to the todo demo block?