使用数据库中的html标签打印文本-Javascript

Question

我在我的React App中使用CKEditor将用户内容保存到Firebase数据库中。 内容按我想要的方式保存（例如，使用html标签"<p>contentheheheh</p>\\n" ），但是当我要获取数据时会出现问题。

由于抓取的结果，让我们说说我收到的带有html标签的文本，例如，未“转换”为粗体或斜体。

当我进入Chrome控制台并检查元素时，会看到以下内容：

<td>&lt;p&gt;I am&amp;nbsp;&lt;strong&gt;testing&amp;nbsp;&lt;/strong&gt;&lt;em&gt;text&lt;/em&gt;&lt;/p&gt;

问题是我之前在Laravel或Symphony中使用过“原始”数据库输入，但是我不知道如何在javascript中进行操作。 我试图在google和堆栈中查找它，但老实说我失败了，因为我什至不知道到底是什么问题，因为“从javascript中从db获取原始数据”并没有按照我的想象完全起作用。

感谢您提前提出任何建议。

PS我知道在Jquery中有这样的事情：

var text = '<p>name</p><p><span style="font-size:xx-small;">ajde</span></p><p><em>da</em></p>';
var decoded = $('<textarea/>').html(text).text();
alert(decoded);

但是我不知道如何用纯JavaScript（或ES6）编写此代码。

Answer 1

您可以使用RegExp替换来做到这一点：

var text = '<p>I am <strong>testing </strong><em>text</em></p>';

var decoded = text.replace(/"&amp;/g, "&").replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, "\""); 

Answer 2

可能（没有我不能真正知道的代码示例），发生情况的原因不是来自获取，而是来自渲染。

默认情况下，渲染组件时react会转义html标签。

为避免转义和设置组件的html，请使用dragonallysetinnerhtml（ https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml ）。

Answer 3

奥基（Okey），所以我在问这个问题之前整晚都在这个问题上度过，然后，我就设法解决了这个问题。

1. 我从npm软件包安装了“他”库（npm安装他）
2. 我安装了“ html-react-parser”（npm安装html-react-parser）。

第一个用于从数据库解码html。 第二个是将此HTML写入jsx元素。

例：

let text = he.decode(props.tdData[item]);
return (<td>{Parser(text)}</td>);

这两个库为我做到了，它可以按我的意愿工作。

感谢您的任何输入，案例已关闭:)