Necesito renderizar bloques de alguna manera de una lista de bloques que obtengo con la siguiente función:
const applyWithSelect = withSelect((select, blockData) => {
const parentClientId = select('core/block-editor').getBlockRootClientId(
selectedClientId
);
return {
innerBlocks: select('core/block-editor').getBlocks(blockData.clientId),
};
});
Entonces aquí, tengo innerBlocks como una matriz de bloques en esa página que se ve así (primer elemento):
0:
attributes: {title: "Enter Title", review: "Enter review", rating: "Add Rating", reviewerName: "Enter Name", reviewDate: "Enter Date", …}
clientId: "2413142124"
innerBlocks: []
isValid: true
name: "something/some-item"
originalContent: "<div>something</div>"
¿Hay alguna manera de usar esta variable de bloques internos en mi función de edición y de alguna manera renderizar el bloque? La razón para no usar <InnerBlocks >
es que tengo que representarlos uno por uno, por lo que cada bloque es un elemento separado en mi control deslizante. Necesitaría algo como esto:
const reviews = this.props.innerBlocks;
return (
<div>
<div className="carousel">
<Slider {...slickSettings} className={classnames(this.props.className)}>
{ reviews.map((block, i) => {
return (
block.render() // this line is the issue, doesn't have to be render, but
// any other way of rendering block separately from InnerBlocks
)
})
}
</Slider>
</div>
</div>
)
.