Постоянно применяйте формат, используя (начальный и конечный индекс) диапазон в блоке WordPress Gutenberg - PullRequest
Новая
       7

Постоянно применяйте формат, используя (начальный и конечный индекс) диапазон в блоке WordPress Gutenberg

0 голосов
/ 15 января 2019

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

wp.data.dispatch( 'core/annotations' ).__experimentalAddAnnotation( {
    source: "my-annotations-plugin",
    blockClientId: wp.data.select( 'core/editor' ).getBlockOrder()[0],
    richTextIdentifier: "content",
    range: {
        start: 50,
        end: 100,
    },
} );

Теперь проблема, с которой я сталкиваюсь, заключается в сохранении этих аннотаций (так как это требование плагина). Я выяснил, что Annotations API внутренне использует метод applyFormat пакета @ wordpress / rich-text , но я не могу понять, как напрямую применять applyFormat. Документация не соответствует требованиям и не содержит примеров кода.

Если вы работали с этим, было бы полезно иметь пример рабочего кода (ES5 или ES6) для правильного использования applyFormat.

1 Ответ

0 голосов
/ 18 января 2019

Я наконец понял это. Просто разместите его здесь, если кому-то нужно это сделать, поскольку в документации Гутенберга нет примеров кода.

Ссылаясь на приведенный ниже код, blockIndex - это блок, с которым вы имеете дело; и startIndex и endIndex - диапазоны для аннотирования в контексте блока: 

// Get latest modified content of the block
let html = wp.data.select( "core/editor" ).getBlocks()[blockIndex].attributes.content;
// Get uuid of the block
let blockUid = wp.data.select( "core/editor" ).getBlocks()[blockIndex].clientId;
// Create a RichText value from HTML string of block content
let value = wp.richText.create({
  html
});
// Apply a format object to a Rich Text value from the given startIndex to the given endIndex
value = wp.richText.applyFormat(value, { type: 'strong' }, startIndex, endIndex);
// Update the block with new content
wp.data.dispatch( 'core/editor' ).updateBlock( blockUid, {
    attributes: {
      content: wp.richText.toHTMLString({
        value
      })
    }
  } );
...