Gutenberg: Czy istnieje sposób na sprawdzenie, czy bieżący blok znajduje się w InnerBlocks?


11

Więc używam zagnieżdżonych bloków w Wordpress Gutenberg. Nakładam opakowanie na moje elementy, które stosują klasę kontenera ładowania początkowego. Oczywiście chciałbym tego tylko na najbardziej zewnętrznych blokach, a nie na tych w zagnieżdżonym bloku.

Czy istnieje sposób na sprawdzenie, czy bieżący blok znajduje się w InnerBlocksdefinicji bloku nadrzędnego? Obecnie stosuję opakowanie w blocks.getSaveElementfiltrze.

Czy jest na to lepszy sposób?

Dla kontekstu: W poprzednich wersjach Gutenberga do tego celu służył atrybut układu, ale od tego czasu został usunięty. Używam wersji 3.9.0.

To jest skrócona wersja mojej funkcji opakowania:

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

Czy kiedykolwiek się dowiedziałeś?
Matthew Brown alias Lord Matt

Odpowiedzi:


3

możesz wywołać getBlockHierarchyRootClientIdza pomocą clientId bloku, getBlockHierarchyRootClientIdzwróci identyfikator bloku nadrzędnego, jeśli bieżący blok znajduje się w insideBlocks i zwróci ten sam identyfikator, jeśli jest rootem

możesz to tak nazwać

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

dodatkowo można zdefiniować funkcję pomocniczą, której można użyć w kodzie

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

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

Myślę, że problem polega na tym, że w tym czasie blocks.getSaveElementnie clientIdzostało jeszcze przypisane żadne, więc wygląda na to, że nie jest możliwe z wnętrza filtra. Być może uda się rozwiązać problem w inny sposób.
Alvaro,

możesz użyć, editor.blockListBlockaby uruchomić czek wewnątrz bloku i przypisać klasę lub coś
N. Seghir
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.