reactjs - 为什么在 react js 中使用 .map() 时我的选项列表为空？

Question

我尝试使用 reactjs 在选项列表中列出一些数据。

我创建了一个常量：

let [dealershipList, setDealershipList] = useState([props.dealerList]);

  const dealershipOptions = () => {
  return (
  dealershipList.map((data) => {
    return(
      <option value={data.id} key={data.id}>{data.name}</option>
    )}
  )
)

}

当我console.log(dealershipList)的数据存在时，但当我console.log(data.id)返回时undefined。

经销商列表包含一个这样的数组：

    [Array(30)]
0: Array(30)
 0: {@id: "/dealers/1f37baca-08cc-4d47-88f8-77b390fd2f50", @type: "Dealer", id: "1f37baca-08cc-4d47-88f8-77b390fd2f50", dealerCode: "70839", name: "Dealer1", …}
 1: {@id: "/dealers/197676fd-693e-4638-89e2-048d1d04d10e", @type: "Dealer", id: "197676fd-693e-4638-89e2-048d1d04d10e", dealerCode: "70916", name: "Dealer2", …}
 2: {@id: "/dealers/1bc5b10a-529e-42e5-b50e-0d8933d19844", @type: "Dealer", id: "1bc5b10a-529e-42e5-b50e-0d8933d19844", dealerCode: "70908", name: "Dealer3", …}
 3: {@id: "/dealers/04796a76-b282-4fd5-9699-f471ac7c8a93", @type: "Dealer", id: "04796a76-b282-4fd5-9699-f471ac7c8a93", dealerCode: "71081", name: "dealer4", …}

我像这样在html中调用我的const：

<div className="form-group">
   <label htmlFor="dealership">
      {t('Dealership')}
   </label>
 <select className="form-control" value={dealership} onChange={(e) => setDealership(e.target.value)}>
      {
       dealershipOptions()
      }
  </select>
</div>

这段代码在一个模式上，当我打开我的模式时，选择经销商的字段是空的。

你知道为什么吗 ？

标签： reactjs