我想在古腾堡编辑器中创建一个块，以创建带有标题和潜台词的列表（带有问答的访谈格式）。该列表应位于有序列表中。

我不知道怎么做。

我想要的结果是：

    <ol>
        <li>
            <h3>This is editable question 1</h3>
            <p>This is the editable answer</p>
        </li>
        <li>
            <h3>This is editable question 2</h3>
            <p>This is the editable answer</p>
        </li>
        <li>
            <h3>This is editable question 3</h3>
            <p>This is the answer</p>
        </li>
    </ol>

到目前为止，我得到的代码只显示一个输入文本：

/**
 * BLOCK: Editable
 *
 * Registering a basic editable block with Gutenberg.
 * Introduces the concept of attributes and extracting
 * them, and the default text formatting added by Editable.
 *
 * Styles:
 *        editor.css — Editor styles for the block.
 *        style.css — Frontend styles for the block.
 */
( function() {
    var __                = wp.i18n.__; // The __() function for internationalization.
    var createElement     = wp.element.createElement; // The wp.element.createElement() function to create elements.
    var registerBlockType = wp.blocks.registerBlockType; // The registerBlockType() function to register blocks.
    var RichText          = wp.editor.RichText; // For creating editable elements.

    /**
     * Register block
     *
     * @param  {string}   name     Block name.
     * @param  {Object}   settings Block settings.
     * @return {?WPBlock}          Block itself, if registered successfully,
     *                             otherwise "undefined".
     */
    registerBlockType(
        \'brandbeat/interview-format\', // Block name. Must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
        {
            title: __( \'Interview format\' ), // Block title. __() function allows for internationalization.
            icon: \'admin-tools\', // Block icon from Dashicons. https://developer.wordpress.org/resource/dashicons/.
            category: \'common\', // Block category. Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
            attributes: {
                content: {
                    type: \'array\',
                    source: \'query\',
                    default: [],
                    selector: \'section .card-block\',
                    query: {
                        headline: {
                            type: \'array\',
                            selector: \'h3\',
                            source: \'children\',
                            default: \'Title\'
                        },
                        description: {
                            type: \'array\',
                            selector: \'.card-content\',
                            source: \'children\',
                            default: \'Answer\'
                        },
                    },
                },
            },

            // Defines the block within the editor.
            edit: function( props ) {
                var content = props.attributes.content;

                function onChangeContent( updatedContent ) {
                    props.setAttributes( { content: updatedContent } );
                }

                return [
                    createElement(
                        RichText,
                        {
                            tagName: \'ol\',
                            className: props.className,
                            value: content,
                            onChange: onChangeContent,
                            onFocus: props.setFocus
                        },
                    )
                ];
            },

            // Defines the saved block.
            save: function( props ) {
                var content = props.attributes.content;

                return createElement(
                    \'p\',
                    {
                        className: props.className,
                    },
                    content
                );
            },
        }
    );
} )();

由于某种原因，我在谷歌上找不到任何示例或教程。