Как обновить атрибуты в блоке WordPress Gutenberg - PullRequest
0 голосов
/ 04 мая 2020

Я создаю блок Гутенберга для WordPress, который будет отображать несколько строк в тегах span. Что-то вроде списка, но это не список, и я хочу использовать теги <span> для переноса строк.

Ожидаемый блок должен иметь такую ​​структуру (это упрощенный пример):

<div>
<p>Whatever</p>
<label><input type="radio" /><span>Editable text</span></label>
<label><input type="radio" /><span>Editable text</span></label>
<label><input type="radio" /><span>Editable text</span></label>
</div>

Проблема, с которой я сталкиваюсь, заключается в том, что я не могу обновить редактируемый текст в объекте атрибутов блока, и вот как я это делаю:

Отображение атрибутов

Я отображаю атрибуты следующим образом:

options: { 
    type: 'array',
    source: 'query',
    selector: 'div',
    default: [],
    query: {
      val: {
        type: 'string',
        selector: 'span',
        source: 'text'
      }
    },
}

Идея состоит в том, чтобы получить массив текстовых значений, содержащихся во всех тегах span в div.

Это работает как ожидалось, и я получил ожидаемый массив, вот console.log для сопоставленного массива:

enter image description here

Внутри редактирования :

Это один из элементов, созданных с помощью React в разделе редактирования блока:

el( PlainText, { 
    tagName: 'span', 
    format: 'string', 
    value: props.attributes.options[0].val, 
    onChange: onChangeOption
} )

Примечание. Я использую только один диапазон для упрощения целей тестирования. Позже каждое значение диапазона будет связано с индексами массива других опций.

Функция, которая обновляет содержимое при изменении, определяется следующим образом:

function onChangeOption(newcontent){
props.attributes.options[0].val = newcontent;
props.setAttributes( { options: props.attributes.options } );
}

Но это не оказывает влияния.

Новый контент определен и содержит ожидаемое значение.

Блок отображается без ошибок в консоли, поэтому я предполагаю, что я обновляю реквизиты атрибута неверным способом.

Я не вставил полный код, потому что я не хочу бросать все это здесь, чтобы просто посмотреть, что происходит. Я предоставляю фрагменты, которые я считаю актуальными, но, пожалуйста, дайте мне знать, если есть что-то еще, что может быть важным.

Большое спасибо за ваше внимание.

...