Draft-js 从 MySql 保存和检索内容的更好方法答案

【问题标题】：Draft-js better way to save and retrive content form MySqlDraft-js 从 MySql 保存和检索内容的更好方法
【发布时间】：2019-11-10 06:55:08
【问题描述】：

我在 reactjs 应用程序中使用带有一些插件的 Draft-js 作为编辑器。

我正在寻找一种在 db 上存储数据并检索该数据的好方法。

我认为更好的解决方案是以两种不同的格式保存数据：

序列化的原始 json 最终转换回内容以在草稿中重新编辑
在查询和发布视图中使用的另一种格式

在我的帖子中我有：

提及
标签
链接

现在我认为只存储链接和标签的文本，并在前端使用 linkify 来呈现 href 标签，但我正在寻找一个很好的提及解决方案。也许是带有提及文本和用户 ID 的序列化字段？

我正在寻找一种解决方案，可以帮助我按内容搜索帖子，并通过快速查询检索大量内容。

这是两行的草稿 js json，带有标签和提及（在 entityMap 中）

{
  "blocks": [
    {
      "key": "19vrn",
      "text": "row 1 with mention and #hashtag",
      "type": "unstyled",
      "depth": 0,
      "inlineStyleRanges": [],
      "entityRanges": [
        {
          "offset": 11,
          "length": 5,
          "key": 0
        }
      ],
      "data": {}
    },
    {
      "key": "46e6h",
      "text": "row 2",
      "type": "unstyled",
      "depth": 0,
      "inlineStyleRanges": [],
      "entityRanges": [],
      "data": {}
    }
  ],
  "entityMap": {
    "0": {
      "type": "mention",
      "mutability": "SEGMENTED",
      "data": {
        "mention": {
          "name": "mention",
          "id": 53,
          "avatar": "b26be1f0-942b-11e9-bebb-a788574b8d0e.jpg",
          "title": ""
        }
      }
    }
  }
}

【问题讨论】：

标签： reactjs draftjs draft-js-plugins

【解决方案1】：

对于那些正在寻找相同问题的人，这是我解决此问题的方法：

我只保存了带有 this.state.editorState.getCurrentContent().getPlainText('') 文本的 postContent
我保存 postRawContent 以供将来编辑：convertToRaw(this.state.editorState.getCurrentContent());
我从 postRawContent 中提取实体映射以供提及
在前端，我循环遍历提及并将@提及替换为带有 href 的正确 html

我希望这可以帮助某人

【讨论】：