Gutenberg: Question: Is there a way to get props, etc of InnerBlocks?

Created on 10 Oct 2018  路  3Comments  路  Source: WordPress/gutenberg

I'm building a custom parent block filled with a bunch of existing blocks. However, I want to get access to the props of the InnerBlocks - what the text content is of a paragraph block, for instance. Is there a way to do this with nested blocks? The only thing I see in the documentation is a way to save the nested content with InnerBlocks.Content.

Thanks for the help!

[Feature] Nested / Inner Blocks [Type] Question

Most helpful comment

I'm not sure if there is a simple API for that, but you can use the wp.data.select methods to fetch the data directly.

This code should get you an array with all child blocks of the current block:

const { clientId } = this.props;
const { select } = wp.data;

const parentBlock = select( 'core/editor' ).getBlocksByClientId( clientId )[ 0 ];
const childBlocks = parentBlock.innerBlocks;

You should get the attributes of the first child Block with childBlocks[ 0 ].attributes or use some filter method to retrieve the data you need.

Hope that helps!

All 3 comments

I'm not sure if there is a simple API for that, but you can use the wp.data.select methods to fetch the data directly.

This code should get you an array with all child blocks of the current block:

const { clientId } = this.props;
const { select } = wp.data;

const parentBlock = select( 'core/editor' ).getBlocksByClientId( clientId )[ 0 ];
const childBlocks = parentBlock.innerBlocks;

You should get the attributes of the first child Block with childBlocks[ 0 ].attributes or use some filter method to retrieve the data you need.

Hope that helps!

Yes, that did help! Thanks so much!

I was using RichText but now its not working what should i do now. i show this code wp.data.select( 'core/editor') but how to use this instead of RichText.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

youknowriad picture youknowriad  路  3Comments

jasmussen picture jasmussen  路  3Comments

mhenrylucero picture mhenrylucero  路  3Comments

maddisondesigns picture maddisondesigns  路  3Comments

hedgefield picture hedgefield  路  3Comments