Question

我的数据库中有一个名为description-long的字段，该字段具有html格式的长描述，我正在使用以下代码检索内容。

 this.props.product.descriptionLong.split("<br />").map((description, index) => <p key={index}>{description} <br/></p>)

但由于某些原因，特殊字符未转换，因此按原样呈现：

        De tijdelijke nep tatoeages in het maximale formaat 50 x 50 mm, u bent
     vrij in het formaat zolang het er maar binnen past! In elke vorm, maat en kleur te drukken. Uiteraard full-color bedrukt. Makkelijk op de 
huid aan te brengen door ze te bevochtigen met water, even aandrukken en 
de papieren drager te verwijderen. Tijdelijke tattoo&#039;s die 5-7 dagen 
blijven zitten, misschien wel langer! Verwijder de neptattoo&#039;s 
eventueel al eerder met een beetje (baby) olie!<br />
        <br /> Per stuk verpakt in een polybag of als bulk geleverd. <br />
        <br />

使用上面的代码，我得到这样的输出

最大尺寸为50 x 50 mm的de tijdelijke棉结，过去的弯曲状态是过去！在elke vorm中，maat en kleur te drukken。 Uiteraard全彩bedrukt。马克·艾克·德·德·赫德·德·布伦根门碰到水，甚至还有阿安德鲁克肯和德·帕皮埃伦·德拉格·德·维维杰伦。 Tijdelijke纹身5到7岁的达根·布赖恩·齐滕（Dagen Blijven Zitten）死了！ Verwijder de neptattoo＆＃039; s eventueel al eerder遇见了een beetje（baby）olie！

Naast de normale全彩opdruk kunnen ook特别效果toegepast worden zoals在黑暗中发光，金属色发光。卫生保健工作组织，卫生保健工作组。在每袋装成袋装的所有散装凝胶中。

是否可以从代码中获取（＆＃039;）特殊字符？ ：）

Answer 1

将代码写为：

this.props.product.descriptionLong.split("<br />").map((description, index) => {
  const htmlText = {
    __html: description
  };
  return <p key={index} dangerouslySetInnerHTML={htmlText} />;
});

阅读dangerouslySetInnerHTML文档。

Example

特殊字符未替换为反应问题

1 个答案: