Draft.js如何表示项目列表?

问题描述 投票:0回答:1

为了创建图像轮播,我想如下创建嵌套块

  • image_carousels
    • 图像
    • 图像
    • 图像

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

但是另一方面,有UL / OL和LI,就像组和元素结构。

是否有一种将元素/组件/块进行分组的方法,以便我们可以渲染整个+个人(例如,我们使用单个图像来渲染轮播)

reactjs draftjs draft-js-plugins
1个回答
0
投票

Draft.js实际上并不将ul / olli作为单独的块支持-它们只是作为ordered-list-itemunordered-list-item块实现,并存储为编辑器中的平面列表。

通过将这些块的depth设置为大于0的值,然后使用包装器将这些块的序列包装到父元素中,“嵌套是伪造的”。请参阅文档:Advanced topics – Custom block wrappers


如果它对您有用,则您可以采用类似的模型,并使用单个块类型image-carousel-item,其中包含每个“幻灯片”的内容,然后使用包装器根据需要渲染带有多个项目的轮播,编辑器以及导出HTML时。

© www.soinside.com 2019 - 2024. All rights reserved.