如何在"<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