如何在“ <p>”中从JSON添加文本？

Question

我正在使用Contentful获取描述文本，并且该描述具有“块”文本，但是当我将其添加到代码中时，输出看起来就像是一行文本。

我正在使用React并将描述作为道具传递，所以我只能编辑整个文本。反正我可以编辑吗？还是我必须导入与Contentful分开的区块？

传递文本的组件：

<Section
  bgImg={images.section1}
  title={data.section1Title}
  description={data.section1Description}
/>

接收文本的组件：

<div className="description">{description}</div>

我的意思是：https://codepen.io/ViniciusBortoletto/pen/jOOBdGy

Answer 1

我看到两个选择。第一个就是您提到的内容，并通过Contenful将其分开。

或者您也可以在React方面做一些事情，并使用Innerhtml并在其中传递带有

标记的描述。

{
 "desc": "<p>First block: Lorem ipsum</p><p>Second block: lorem ipsum</p>"
}

如果您使用InnerHTML路由，请注意可能的安全问题。这是我发现可能会有所帮助的React软件包：

https://www.npmjs.com/package/react-inner-html