Reactjs React.js选择链接表

我想创建一个选择输入，用户可以在其中选择类别，但它会为数据库中的每个项目显示重复的类别

我的json（还有更多数据）：

代码：

var-products=props.products.map（（产品）=>{
返回(
{product.category.name}
)
})
formFields.category_id=input}必需>
没有一个
{产品}

---

现在我的选择看起来像：无、书籍、电影、电影、书籍。

删除重复项并生成唯一类别名称集合（我将其解释为您的目标）的简单方法是从产品类别名称数组中实例化一个新的

集合

对象，如下所示。要继续使用

.map

生成选项，请从

集合

创建一个新数组

    const catNameArr = Array.from(new Set(productJson.map(p => p.category.name)))
    /* .map over category name array to generate option els */

---

怎么了？我没问题

 var products = props.products.map((product) => {
  return(
    
 <option key={product.id} value = {product.category_id}>{product.category.name}</option>
        
  )
})

<select ref={input => formFields.category_id = input}  required >
              <option value = "">None</option>
              {products}
 </select>

    const catNameArr = Array.from(new Set(productJson.map(p => p.category.name)))
    /* .map over category name array to generate option els */