部署在Heroku的Strapi添加描述项目符号并前端渲染的实现方法咨询

1. 在Strapi中配置支持富文本的字段 #

在Strapi的Content Type Builder里，找到你要添加描述字段的内容类型（比如Product或Post）并点击编辑：

• 若已有纯文本description字段，可直接删除替换
• 添加一个Rich Text类型的字段，命名为description
• 保存内容类型，Heroku上的Strapi应用会自动重启生效

2. 在Strapi后台添加带项目符号的内容 #

进入对应内容的管理页面创建/编辑内容时：

• 在description的Rich Text编辑器中，点击工具栏的项目符号列表按钮
• 依次输入每个列表项内容，编辑器会自动生成结构化的列表格式

3. 前端拉取并渲染项目符号列表 #

通过Strapi的API（比如GET /api/your-content-type）拉取数据时，description字段会返回HTML格式的内容，示例如下：

<ul>
  <li>第一项内容</li>
  <li>第二项内容</li>
</ul>

在网站前端直接渲染这段HTML即可：

• 原生HTML：将内容插入指定元素，比如document.getElementById('desc').innerHTML = response.data.attributes.description;
• React：使用dangerouslySetInnerHTML，比如<div dangerouslySetInnerHTML={{ __html: item.description }} />
• Vue：使用v-html指令，比如<div v-html="item.description"></div>

这样就能在网站上显示和Strapi后台一致的项目符号列表了。

内容的提问来源于stack exchange，提问作者Simen Martinsen