将 react-quill 用于博客应用程序，以便用户可以创建帖子。如何在 React 中正确显示一串 html 元素？

Question

我正在用 React 和 Rails 创建一个博客应用程序，并且我开始使用 react-quill 为用户提供 post 文章。但是，当用户提交他们的 post 时，输出是一个包含 HTML 元素的字符串。

例如：Line1 Line2

我该如何解析 HTML 字符串才能正确显示？

非常感谢！

Answer 1

您可以使用 dangerouslySetInnerHTML 从字符串中呈现 HTML。

例子

function App() {
  return (
    <div
      dangerouslySetInnerHTML={{ __html: "<p>Line1</p><br /><p>Line2</p>" }}
    />
  );
}

ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="root"></div>

将 react-quill 用于博客应用程序，以便用户可以创建帖子。如何在 React 中正确显示一串 html 元素？

Using react-quill for a blog app so users can create posts. How do I properly display a string of html elements in React?

html

javascript

reactjs

quill