Гутенберг: Чи є спосіб дізнатися, чи є поточний блок всередині InnerBlocks?


11

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

Чи є спосіб дізнатися, чи поточний блок знаходиться всередині InnerBlocksDefiniton батьківського блоку? Зараз я застосовую обгортку всередині blocks.getSaveElementфільтра.

Чи є кращий спосіб зробити це?

Для контексту: У попередніх версіях gutenberg раніше був атрибут верстки для досягнення цього, але він був видалений. Я використовую версію 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поверне ідентифікатор батьківського блоку, якщо поточний блок знаходиться у внутрішній Блоки, і поверне той самий ідентифікатор, якщо він є root

ви можете назвати це так

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для запуску чека всередині блоку та присвоєння класу чи чогось іншого
N. Seghir
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.