Javascript 呈现多个输入

我使用React创建了一个简单的预算应用程序。用户可以通过填写输入来添加收入/费用说明和值，最终结果将添加到费用/收入列表中

我设法添加了收入/支出值（数字）：我创建了一个带有收入[1,3,4]的setState，映射收入数组并通过更新状态打印出值

我不明白如何添加描述。我在堆栈中检查了一些问题，但它们只使用setState并为每个元素（收入、收入值、费用、支出值）创建一个状态，这不是我想要的

有没有办法做到这一点而不涉及太多国家？也许用一个物体

---

您的状态是一个对象

{
  monthlyBudget: 0,
  incomesSum: 0,
  expensesSum: 0,
  incomes: [0],
  expenses: [0]
}

除了向Incomers数组中添加更多数字之外，您还可以向Incomers数组中添加对象。跟你猜的一模一样

{
  monthlyBudget: 0,
  incomesSum: 0,
  expensesSum: 0,
  incomes: [
    { amount: 0, description: 'some description' },
    { amount: 1, description: 'second description' },
  ]
  expenses: [0]
}

在这种情况下，您仍然可以使用map访问对象的属性

this.sate.incomes.map(income => {
  // do something with income.amount
  // do something with income.description
})

---

所以你想在“收入”数组中有一个键值对而不是整数？当然，你可以有一个对象数组。这真的取决于你想如何建模你的数据，这不是一个单一的正确的方法。我已经使用了…但当然描述返回未定义。所以我应该这样做？setState（）{incoments:{value:[2333,29]，description:['Number-one'，'Number-Two'，'Three']}