Гутенберг: Есть ли способ узнать, находится ли текущий блок внутри InnerBlocks?


11

Поэтому я использую вложенные блоки в Wordpress Gutenberg. Я применяю обертку к своим элементам, которые применяют класс контейнера начальной загрузки. Очевидно, я бы хотел, чтобы это было только на внешних блоках, а не на тех, которые находятся внутри вложенного блока.

Есть ли способ узнать, находится ли текущий блок внутри InnerBlocksDefiniton родительского блока? В настоящее время я применяю оболочку внутри blocks.getSaveElementфильтра.

Есть лучший способ это сделать?

Для контекста: в предыдущих версиях Гутенберга для этого был атрибут макета, но с тех пор он был удален. Я использую версию 3.9.0.

Это сокращенная версия моей функции-обертки:

    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);

Вы когда-нибудь узнавали?
Мэтью Браун ака Лорд Мэтт

Ответы:


3

Вы можете вызвать getBlockHierarchyRootClientIdс помощью clientId блока, getBlockHierarchyRootClientIdвернет идентификатор родительского блока, если текущий блок находится внутри innerBlocks, и вернет тот же идентификатор, если он корень

Вы можете назвать это так

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

Кроме того, вы можете определить вспомогательную функцию, которую вы можете использовать в своем коде

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

if ( blockHasParent( yourClientId ) { 
    ....
}


Я думаю, что проблема в том, что во время blocks.getSaveElementпрогонов еще не clientIdбыло назначено, так что похоже, что это невозможно изнутри фильтра. Возможно, можно найти решение, пытаясь обойти это каким-то другим способом.
Альваро

Вы можете использовать editor.blockListBlockдля проверки внутри блока и назначить класс или что-то
Н. Сегир
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.