reactjs - Draft.js 如何表示项目列表？

Question

为了创建图像轮播，我认为创建嵌套块如下

• image_carousels
  • 图片
  • 图片
  • 图片

然后我发现 draft.js 不支持嵌套块。（https://github.com/facebook/draft-js/issues/143他们说 draft.js 是平的）

但另一方面，还有 UL/OL 和 LI ，这就像组和元素结构。

有没有办法对元素/组件/块进行分组，以便我们可以渲染整个+个体（例如我们用单个图像渲染轮播）

Answer 1

Draft.js 实际上并不支持ul/ol和li作为单独的块——这些只是实现为ordered-list-item和unordered-list-item块，在编辑器中存储为平面列表。

depth通过将这些块设置为高于 0 的值，并使用包装器将这些块的序列包装到父元素中，嵌套是“伪造的” 。请参阅文档：高级主题 - 自定义块包装器 。

---

如果它适合您，您可以遵循类似的模型并拥有一个image-carousel-item包含每个“幻灯片”内容的块类型，然后使用包装器在编辑器中和导出时使用您想要的多个项目呈现轮播HTML。