<div>
  {recipe.strTags && recipe.strTags.split(",").map((tag) => <Chip label={tag} />)}
</div>

您需要拆分字符串以创建数组，然后使用map对其进行迭代以创建每个标签。还记得添加吗 key 属性以避免重新渲染问题。
解决方案：

<div>
  {
     recipe.strTags
        ? recipe.strTags
                .split(',')
                .map(label => (
                   <Chip label={label} key={label} />
                ))
        : null
  }
</div>

假设 Chip 组件是您希望看到的这些圆形框之一，您必须创建一个单独的 Chip 对于每个标签。即 split 首先是字符串和用法 map 创建 Chip 对于数组中的每个项。

<div>
  {recipie.strTags 
    ? recipie.strTags.split(',').map(tag => (<Chip label={tag}/>)) 
    : null}
<div>