Гутенберг: Чи є спосіб дізнатися, чи є поточний блок всередині 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.