wordpress Gutenberg: Ошибка проверки блока для `core / image` при добавлении атрибута данных (data-id =" ") - PullRequest
0 голосов
/ 25 мая 2020

Получение ошибки проверки Гутенберга при добавлении атрибута данных (с использованием Изменить как HTML) в тег привязки, эта проблема возникает, когда тег привязка внутри рисунок тег.

Когда пользователь добавляет изображение и оборачивает это изображение ссылкой, при событии onsubmit наш плагин сканирует содержимое сообщения и добавляет атрибут данных в ссылку при обновлении / повторном открытии сообщения на странице редактирования снова отображается ошибка проверки Гутенберга.

<figure class="wp-block-image size-large">
   <a href="http://affiliate.local/wp-admin/post.php?post=56662&amp;action=edit" data-lasso-id="123">
     <img src="http://affiliate.local/wp-content/uploads/2019/06/mint_2018_icon-toolbox-640x640.jpg" alt="" class="wp-image-51176"/>
   </a>
</figure>

enter image description here enter image description here

1 Ответ

0 голосов
/ 06 июня 2020

После многих попыток и ошибок я получил свое решение.

wp.hooks.addFilter(
    "blocks.registerBlockType",
    "sample-plugin/plugin/attribute/data",
    (settings, name) => {
        if (name == "core/image") {
            settings.attributes = Object.assign( settings.attributes, {
                'data-id': {
                    attribute: "data-id",
                    selector: "figure > a",
                    source: "attribute",
                    type: "string",
                },
            });
        }
        return settings;
    }
);


function applyExtraClass( extraProps, blockType, attributes ) {
    if(blockType.name != 'core/image') {
        return extraProps;
    }

    try {
        let figure_props = extraProps.children.props;
        let first_child = figure_props.children[0];
        if(figure_props.children && first_child && (first_child.type == 'a')) {
            first_child.props['data-id'] = attributes["data-id"];
        }
    } catch (error) {
        console.log(error);
    }
    return extraProps;
}

wp.hooks.addFilter(
    'blocks.getSaveContent.extraProps',
    'sample-plugin/plugin',
    applyExtraClass
);
...