Редактор slate.js - как вставить блок рисунка

Я пытаюсь вставить блок рисунка, который содержит изображение и figcaption в редактор Slate, и я не могу заставить его работать. Я полагаюсь на примеры в документах, но они не очень понятны и не объясняют, как все это вставить. Насколько я понимаю, вы должны вставить его в синтаксис объектной модели, а не в прямой HTML (что, IMHO, было бы намного проще).

Вот что у меня есть:

insertImage = (change, src, alt, target) => {

    if (target) {
      change.select(target)
    }

    let figcaption = Block.create({
      type: 'figcaption',
      text:  alt,
      isVoid: false
    });
    let image = Block.create({
      type: 'image',
      data: {src, alt},
      isVoid: true
    });
    let figure = Block.create({
      type: 'figure',
      isVoid: false,
      nodes: [image, figcaption]
    });

    return change
      .insertBlock(figure)
  }

Мои вопросы:

  1. Разве я не могу просто создать блок HTML, сериализовать его, а затем вставить? Почему я должен воссоздать все эти блоки, если якобы уже создал все эти "Правила"?
  2. Используя приведенный выше код, изображение вставляется, но заголовок - нет. Что мне не хватает? Не совсем уверен из документации, как вставить просто элемент с простым текстом внутри. Документы на самом деле не объясняют это примерами.
  3. Я попытался вставить figcaption с узлами: alt, но это возвращает с ошибкой "node.map не является функцией"

Надеюсь, кто-то может помочь!

0 ответов

Другие вопросы по тегам