javascript - 如何将 html 转换为 draftjs？

Question

我已经尝试过基本的软件包，但我似乎不明白发生了什么，

这是我尝试过的；

const {
  convertFromHTML,
  ContentState
} = require('draft-js');
const htmlToDraft = require('html-to-draftjs');

const converter = () => {
    const sampleMarkup =
      '<b>Bold text</b>, <i>Italic text</i><br/ ><br />' +
      '<a href="http://www.google.com">Example link</a>';

    const blocksFromHTML = convertFromHTML(sampleMarkup);
    const state = ContentState.createFromBlockArray(blocksFromHTML);

    console.log('state: ', state);
}

converter();

使用哪个库真的很清楚。我得到看起来很奇怪的输出，我期望看起来像这样；

{
  "blocks": [
    {
      "depth": 0,
      "inlineStyleRanges": [
        {
          "length": 9,
          "style": "BOLD",
          "offset": 0
        },
        {
          "length": 12,
          "style": "ITALIC",
          "offset": 11
        }
      ],
      "entityRanges": [
        {
          "length": 12,
          "key": 0,
          "offset": 25
        }
      ],
      "data": {},
      "text": "Bold text, Italics text\n\nexample link ",
      "key": "9jc4q",
      "type": "unstyled"
    }
  ],
  "entityMap": {
    "0": {
      "type": "LINK",
      "mutability": "MUTABLE",
      "data": {
        "url": "http://www.google.com",
        "targetOption": "_blank"
      }
    }
  }
}

有什么见解吗？ (服务器端的代码)

Answer 1

const sampleMarkup =
  '<b>Bold text</b>, <i>Italic text</i><br/ ><br />' +
  '<a href="http://www.facebook.com">Example link</a>';

const blocksFromHTML = convertFromHTML(sampleMarkup);
const state = ContentState.createFromBlockArray(
  blocksFromHTML.contentBlocks,
  blocksFromHTML.entityMap,
);

this.state = {
  editorState: EditorState.createWithContent(state),
};