Получить идентификаторы изображений из блока галереи во внутренних блоках пользовательского блока Гутенберга
Я в основном создаю пользовательский блок карусели Гутенберга. Это может быть карусель во внешнем интерфейсе, и я планирую использовать блок галереи для добавления изображений в карусель.
Карусель будет загружена с использованием bxSlider, который требует определенного синтаксиса, как вы можете видеть здесь. Галерея визуализирует другой синтаксис во внешнем интерфейсе (вывод изображений на основе списка). Я хочу изменить синтаксис визуализированной галереи.
В render_callback
кажется, что аргумент изменяет вывод, но для того, чтобы это работало, мне нужны идентификаторы всех изображений в галерее.
Ближе всего к выходу я пришел в этой ветке с использованием модулей данных иwithDispatch
компонент для получения данных, но я не знаю, как использовать его в JSX-скрипте. Это сценарий для моего пользовательского блока -
const { registerBlockType } = wp.blocks;
const { InnerBlocks } = wp.blockEditor;
const ALLOWED_BLOCKS_GALLERY = ['core/gallery'];
const GALLERY_TEMPLATE = [
['core/gallery', {} ]
];
registerBlockType('my-plugin/my-plugin-carousel', {
title: 'Carousel',
description: 'Insert a Carousel using Images from Gallery',
category: 'common',
icon: {
src: 'image-flip-horizontal',
foreground: '#1d7eb6'
},
attributes: {},
edit: (props) => {
return([
<div className="my-carousel-container">
<InnerBlocks allowedBlocks={ ALLOWED_BLOCKS_GALLERY } template={ GALLERY_TEMPLATE } templateLock="insert"/>
</div>
])
},
save: () => {
return <InnerBlocks.Content />
}
});
Любая помощь о том, как действовать в этой ситуации, будет принята с благодарностью! Я потратил на это последние два дня, и мне нечего показать.