Draft.js как представить список элементов?

Чтобы создать карусель изображений, я подумал о создании вложенных блоков следующим образом.

  • image_carousels
    • image
    • изображение
    • изображение

Затем я обнаружил, что draft.js не поддерживает вложенные блоки. (https://github.com/facebook/draft-js/issues/143 говорят, что draft.js плоский)

Но, с другой стороны, есть UL/OL и LI, это как структура групп и элементов.

Есть ли способ сгруппировать элементы/компоненты/блоки, чтобы мы могли визуализировать все + отдельные (например, мы визуализируем карусель с отдельными изображениями)


person eugene    schedule 15.09.2019    source источник


Ответы (1)


Draft.js на самом деле не поддерживает ul/ol и li как отдельные блоки — они просто реализованы как блоки ordered-list-item и unordered-list-item, которые хранятся в виде плоского списка в редакторе.

Вложение «подделывается», когда для depth этих блоков устанавливаются значения выше 0, и используются обертки для переноса последовательностей этих блоков в родительский элемент. См. документацию: Дополнительные темы — Пользовательские оболочки блоков .


Если это работает для вас, вы можете следовать аналогичной модели и иметь один тип блока image-carousel-item, который содержит содержимое каждого «слайда», а затем использовать оболочку для рендеринга каруселей с несколькими элементами, как вы хотите, как в редакторе, так и когда экспорт HTML.

person Thibaud Colas    schedule 26.09.2019