如何使用draft-js从数据库中获取/保存数据

Question

我决定在这里提出这个问题。我使用 mysql 作为数据库作为存储，并希望将 Draft-js 添加到我现在正在构建的网页中。获取和保存数据到数据库的正确方法是什么？任何工作示例都会很棒！

Answer 1

您应该使用convertToRaw和convertFromRaw方法。文档摘录：

convertFromRaw(rawState: RawDraftContentState): ContentState

给定一个原始状态，将其转换为 ContentState。这在恢复要在草稿编辑器中使用的内容时非常有用。

convertToRaw(contentState: ContentState): RawDraftContentState

给定一个 ContentState 对象，将其转换为原始 JS 结构。这在保存编辑器状态以供存储、转换为其他格式或应用程序中的其他用途时非常有用。

我分叉了这支笔来演示这些方法是如何工作的。打开我的笔。首先，让我们考虑保存编辑器状态。我添加了“日志编辑器状态”按钮。如果您打开控制台并单击按钮，您可以看到编辑器状态的当前表示为 JavaScript 对象。您可以将此对象转换为 JSON 并使用适当的 API 端点将此 JSON 保存在您的数据库中。

单击以查看完整尺寸的图像

当您需要在页面上显示您的编辑器不为空时的情况，其中包含您之前保存在数据库或本地存储中的预定义内容。在这里，你应该使用createWithContent方法和上面提到的convertFromRaw方法。在我的示例中，我将 JSON 字符串存储在变量中editorStateAsJSONString，对于实际情况，您应该请求 API 端点，该端点返回 JSON，然后按照描述呈现编辑器组件。