reactjs - 我无法在反应中使用 Draft-js 解析来自 html 的正确内容

Question

我正在尝试从 html 解析数据，但没有运气。我能够从 html 中获取粗体文本，但对于有序或无序列表，无法打印列表的文本（有序无序列表）

草稿.js

import React, { useState } from "react";
import { EditorState, convertToRaw } from "draft-js";
import { Editor } from "react-draft-wysiwyg";
import { convertToHTML } from "draft-convert";
import DOMPurify from "dompurify";
import draftToHtml from 'draftjs-to-html';
import htmlToDraft from "html-to-draftjs";
import parse from 'html-react-parser';
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
import './styles/global.css';

const App = () => {
  const [editorState, setEditorState] = useState(() =>
    EditorState.createEmpty()
  );
  const [convertedContent, setConvertedContent] = useState(null);
  console.log('converte', convertedContent)
  const handleEditorChange = (state) => {
    setEditorState(state);
    convertContentToHTML();
  };

  const convertContentToHTML = () => {
    let currentContentAsHTML = convertToHTML(editorState.getCurrentContent());
    setConvertedContent(currentContentAsHTML);
  };

  const createMarkup = (html) => {
    return {
      __html: DOMPurify.sanitize(html)
    };
  };

  return (
    <div className="App">
      <header className="App-header">Rich Text Editor Example</header>
      <Editor
        editorState={editorState}
        onEditorStateChange={handleEditorChange}
        wrapperClassName="wrapper-class"
        editorClassName="editor-class"
        toolbarClassName="toolbar-class"
      />
      <h1>Output-1</h1>
      <div
        className="preview m-10"
        dangerouslySetInnerHTML={createMarkup(convertedContent)}
      ></div>
    </div>
  );
};

笔记

在代码框上使用相同的代码时，我得到了预期的输出。这是样本

预期产出

实际输出