Wordpress Gutenberg - вложенные дочерние элементы

Question

Я новичок в реагировании, поэтому я немного пытаюсь добавить собственный блок в редактор Гутенберга. Сам блок отображается, но выдает ошибку «В этом блоке обнаружена ошибка, и его нельзя просмотреть».

Вот код, который я получил до сих пор

edit: function() {
        var tb = element.createElement('input', { placeholder: 'Enter a url', type: 'text' },
            [element.createElement(
                'p',
                { style: blockStyle },
                'Child 1'
            )]
        );
        return tb;

    },

Я пытаюсь получить текстовый элемент управления и метку для отображения, как это

<input type='text' name='mytb' />
<label for="mytb">My Label</label>

Что я делаю не так?

Заранее спасибо

Answer 1

var tb = [element.createElement( 'input', { placeholder: 'Enter a url', type: 'text' } ),
         element.createElement( 'p', {}, 'Child 1' )];
return tb;

Я исправил некоторые проблемы с кодом и удалил ваш blockStyle.Вы должны убедиться, что вы определили эту переменную.

Answer 2

В вашем коде вы поместили элемент абзаца как потомок ввода, это невозможно, поэтому вы получаете сообщение об ошибке.

Это должно быть:

 var tb = element.createElement('input', { placeholder: 'Enter a url', type: 'text' }),
          element.createElement( 'p', { style: blockStyle }, Child 1');
return tb;