显示来自 Draftjs 的数据块

Question

如何在 react 组件中显示我保存到 mongodb 的原始文件，从 draftjs 编辑器？

这是我数据库中的内容：

"blocks" : [ 
            {
                "key" : "7abte",
                "text" : "example",
                "type" : "unstyled",
                "depth" : 0,
                "inlineStyleRanges" : [ 
                    {
                        "offset" : 0,
                        "length" : 20,
                        "style" : "BOLD"
                    }
                ],
                "entityRanges" : []
            }
        ]

我发现了如何将它返回给编辑器（编辑数据），一切正常。但是我不能在前端显示它。

我还尝试将我的编辑器内容导出到语义 HTML，这是我收到的：

但就像你看到的那样，我不知道如何显示它，不是作为字符串而是作为 html..

你对我的问题有什么好的解决办法吗？

Answer 1

如果你需要处理 HTML 以在前端显示，你应该使用这样的东西：

<div dangerouslySetInnerHTML={{__html: YourMarkupVar}} />

否则，React 作为一种安全措施，将对标签进行编码并显示为普通文本。