如何映射包含数组的对象

Question

我是 javascript 新手，所以我有一个包含三个数组的对象，我想映射它并列出我的数据

    const [Foods,setFoods] = useState({

      "id_food":[1,2,3],

      "name_food":["food1","food2","food3"],

      "quantity":[10,22,12]

  })

一个虚构的代码：

{ Foods.map((id,name,qte) =>(

    <p>{id}{name}{qte}</p>

 ))}

Answer 1

&nbsp;&nbsp;Object.keys(Foods).forEach(prop&nbsp;=>&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Foods[prop].map((item)&nbsp;=>&nbsp;console.log(item)); &nbsp;&nbsp;});

Answer 2

也许是这样的：Foods.id_food.map((id, i) => {&nbsp; &nbsp; const name_food = Foods.name_food[i];&nbsp; &nbsp; const quantity = Foods.quantity[i];&nbsp; &nbsp; return&nbsp; <AwesomeReactComponent key={id} nameFood={name_food} quantity={quantity}/>;});

Answer 3

let mappedArray = Foods.id_food.map((ele, i) => {&nbsp; &nbsp; let name = Foods.name_food[i]&nbsp; &nbsp; let quantity = Foods.quantity[i]&nbsp; &nbsp; return {id: ele, name: name, quantity: quantity}})输出：(3) [{…}, {…}, {…}]0: {id: 1, name: "food1", quantity: 10}1: {id: 2, name: "food2", quantity: 22}2: {id: 3, name: "food3", quantity: 12}