javascript - 如何在页面上显示包含 JSON 对象的数组？

Question

我有一个 JSON 格式的数组:

[
    {
        "id": 0,
        "type": "phone",
        "model": "Iphone 11"
    },
    {
        "id": 1,
        "type": "phone",
        "model": "Iphone 11 PRO"
    }
]

我有一个“axios”请求:

const [phone,setPhone] = useState({}) // react-hook

const getPhones = () => {
      Axios.get('/phones.json').then(({data}) => {
      setPhone(data)
      console.log(data)
    })
  }

所以我想展示，例如第一个和第二个对象的“类型”和“模型”？我该怎么做？

没用

    <div>
      <div>{phone.type}</div>
      <button onClick={getPhones}>click</button>
    </div>

Answer 1

尝试循环并打印出来。像这样:

<Table> <!-- or dl dd structure -->
<tr>
  <th>c1</th>
  ...
</tr>
{
   phone.map((p,index)=>(
      <tr key={index}>
        <td>{p.mtype}</td>
        ...
      </tr>

   )
}
</Table>