¿Cómo “manualmente” (programáticamente) insertar un bloque en Gutenberg?

1 minuto de lectura

avatar de usuario
bastien ho

La API de Gutenberg es bastante oscura y no puedo entender cómo crear y agregar un bloque a una publicación.

he encontrado el wp.blocks.createBlock('core/paragraph', {content: "blabla"}); que devuelve un bonito objeto de bloque, pero no agrega ningún contenido a la publicación.

Me gustaría insertar un párrafo simple con contenido personalizado simplemente haciendo clic en un botón.

var content = "Test content";
var el = wp.element.createElement;
var name="core/paragraph";
// var name="core/html";
insertedBlock = wp.blocks.createBlock(name, {
    content: content,
});
wp.data.dispatch('core/editor').insertBlocks(insertedBlock);

Tal vez este código fuente pueda ayudar https://github.com/WordPress/gutenberg/blob/master/editor/components/inserter/index.js

Mire el final del archivo para la parte

onInsertBlock: ( item ) => {
        const { insertionPoint, selectedBlock } = ownProps;
        const { index, rootUID, layout } = insertionPoint;
        const { name, initialAttributes } = item;
        const insertedBlock = createBlock( name, { ...initialAttributes, layout } );
        if ( selectedBlock && isUnmodifiedDefaultBlock( selectedBlock ) ) {
            return dispatch( 'core/editor' ).replaceBlocks( selectedBlock.uid, insertedBlock );
        }
        return dispatch( 'core/editor' ).insertBlock( insertedBlock, index, rootUID );
    },

Para ser más especifico

return dispatch( 'core/editor' ).insertBlock( insertedBlock, index, rootUID );

La esperanza ayuda a resolver tu problema, ya que está haciendo lo mismo que quieres lograr.

¿Ha sido útil esta solución?