Как заставить сохраняться массив в Gutenberg?

Question

[Елизавета Красова]

Всем привет. Создаю свой кастомный блок для Gutenberg и возникла такая проблема:
Пытаюсь сохранять multiline элементы списка(li) в массив, как показано на примере, но при обновлении всё сбрасывается и массив снова пустой, т.е. данные просто не сохраняются. Этот массив передается на render_callback и используется уже для вывода.
Буду рада любой помощи и советам :)

const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;
export const el = wp.element.createElement;

const {
    RichText
} = wp.blockEditor;

const icon = el('svg', { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 18 18", color: '#0d34be' },
    el('path', { d: "M12.5 3a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5zm0 3a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5zm.5 3.5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h5a.5.5 0 0 0 .5-.5zm-.5 2.5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5z" } ),
    el('path', { d: "M16 2a2 2 0 0 0-2-2H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2zM4 1v14H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h2zm1 0h9a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H5V1z" } ),
);

registerBlockType('create-block/test-block', {
    title: __('Block', 'test-block'),
    icon: icon,
    category: 'common',
    attributes: {
        ingredients: {
            type: 'array',
            source: 'children',
            selector: '.ingredients',
        },
    },
    edit({ className, attributes, setAttributes, isSelected }) {
        const {
            ingredients,
        } = attributes

        return (
            <div>
                <RichText
                    tagName="ul"
                    multiline="li"
                    placeholder={ __(
                        'Write a list of ingredients…',
                        'gutenberg-examples'
                    ) }
                    value={ ingredients }
                    onChange={ ( value ) => {
                        setAttributes( { ingredients: value } );
                    } }
                    className="ingredients"
                />
            </div>
        );
    },

    save({ attributes }) {
        return null;
    }
});

Comments

[Елизавета Красова]

yarovikov, к сожалению, не вижу. Подскажите, пожалуйста, что не так

[Елизавета Красова]

Этот же пример, но со строкой. Без save, как вы говорите, но все прекрасно сохраняется. Поэтому вопрос все еще актуален

const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;
export const el = wp.element.createElement;

const {
    RichText
} = wp.blockEditor;

const icon = el('svg', { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 18 18", color: '#0d34be' },
    el('path', { d: "M12.5 3a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5zm0 3a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5zm.5 3.5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h5a.5.5 0 0 0 .5-.5zm-.5 2.5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1h5z" } ),
    el('path', { d: "M16 2a2 2 0 0 0-2-2H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2zM4 1v14H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h2zm1 0h9a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H5V1z" } ),
);

registerBlockType('create-block/test-block', {
    title: __('Block', 'test-block'),
    icon: icon,
    category: 'common',
    attributes: {
        title: { type: 'string' },
    },
    edit({ className, attributes, setAttributes, isSelected }) {
        const {
            title ,
        } = attributes

        return (
            <div>
                <RichText
                    tagName="h1"
                    value={ title }
                    onChange={ ( value ) => {
                        setAttributes( { title: value } );
                    } }
                />
            </div>
        );
    },

    save({ attributes }) {
        return null;
    }
});