Gutenberg: Apakah ada cara untuk mengetahui apakah blok saat ini ada di dalam InnerBlocks?

11

Jadi saya menggunakan blok bersarang di Wordpress Gutenberg. Saya menerapkan pembungkus pada elemen saya yang menerapkan kelas wadah bootstrap. Jelas saya hanya ingin itu di blok terluar, bukan pada yang di dalam blok bersarang.

Apakah ada cara untuk mengetahui apakah blok saat ini berada di dalam InnerBlocksDefiniton dari blok induk? Saat ini saya menerapkan pembungkus di dalam blocks.getSaveElementFilter.

Apakah ada cara yang lebih baik untuk melakukan ini?

Untuk konteks: Dalam versi gutenberg sebelumnya dulu ada atribut tata letak untuk mencapai itu, tetapi sejak itu telah dihapus. Saya menggunakan Versi 3.9.0.

Ini adalah versi singkat dari fungsi pembungkus saya:

    namespace.saveElement = ( element, blockType, attributes ) => {
        const hasBootstrapWrapper = hasBlockSupport( blockType.name, 'bootstrapWrapper' );

        if (hasBlockSupport( blockType.name, 'anchor' )) {
            element.props.id = attributes.anchor;
        }
        if (hasBootstrapWrapper) {

            // HERE I NEED TO CHECK IF THE CURRENT ELEMENT IS INSIDE A INNERBLOCKS ELEMENT AND THEN APPLY DIFFERENT WRAPPER

            var setWrapperInnerClass = wrapperInnerClass;
            var setWrapperClass = wrapperClass;
            if (attributes.containerSize) {
                setWrapperInnerClass = wrapperInnerClass + ' ' + attributes.containerSize;
            }
            if (attributes.wrapperType) {
                setWrapperClass = wrapperClass + ' ' + attributes.wrapperType;
            }

            const setWrapperAnchor = (attributes.wrapperAnchor) ? attributes.wrapperAnchor : false;

            return (
                newEl('div', { key: wrapperClass, className: setWrapperClass, id: setWrapperAnchor},
                    newEl('div', { key: wrapperInnerClass, className: setWrapperInnerClass},
                        element
                    )
                )
            );
        } else {
            return element;
        }
    };

wp.hooks.addFilter('blocks.getSaveElement', 'namespace/gutenberg', namespace.saveElement);
deadfishli
sumber
Apakah Anda pernah mengetahuinya?
Matthew Brown alias Lord Matt

Jawaban:

3

Anda dapat memanggil getBlockHierarchyRootClientIddengan clientId dari blok, getBlockHierarchyRootClientIdakan mengembalikan id induk blok jika blok saat ini di dalam innerBlocks dan akan mengembalikan id yang sama jika itu root

Anda bisa menyebutnya seperti ini

wp.data.select( 'core/editor' ).getBlockHierarchyRootClientId( clientId );

Selain itu, Anda dapat menentukan fungsi pembantu yang dapat Anda gunakan dalam kode Anda

const blockHasParent = ( clientId ) => clientId !== wp.data.select( 'core/editor' ).getBlockHierarchyRootClientId( clientId );

if ( blockHasParent( yourClientId ) { 
    ....
}
N. Seghir
sumber
Saya pikir masalahnya adalah bahwa pada saat blocks.getSaveElementberjalan belum clientIdditetapkan jadi sepertinya tidak mungkin dari dalam filter. Mungkin solusi dapat dicapai dengan mencoba menyelesaikan masalah dengan cara lain.
Alvaro
Anda dapat menggunakan editor.blockListBlockuntuk menjalankan pemeriksaan di dalam blok dan menetapkan kelas atau sesuatu
N. Seghir