Question

我有一个带有收音机输入的表格。每次用户选择on选项时，如果与用户回答的问题相同，我必须更新包含问题答案的数组以覆盖旧的答案。所以我有这个useState 在我看来，这将映射答案的旧值，映射问题的答案是否已经存在，Object.assign()映射，否则，如果它是新问题的新答案，则只需返回答案即可。但是它仅返回默认数组。如果像[{}]一样初始化，它将返回Array[{}]。如果为[]，则返回Array[]

状态为 const [answers, setAnswers] = setState([])

  const handleCheckbox = (e, question) => {
    const newAnswer = { choice: e.target.id, question: question.uuid };

    setAnswers(
      [...answers],
      answers.map(
        answer =>
          answer.question === newAnswer.question ?
          Object.assign(answer, newAnswer): 
          newAnswer
      )
    );
  };

预期：answers: [{id: 1}, {id: 2},...]，而无需重复其中的内容。

实际：Array[]

Answer 1

不确定要执行的操作，您正在调用带有两个参数的更新程序setAnswers，而它只需要一个参数。您预期的结果[answerQuestion1: {}, answerQuestion2:{},...]不是有效的JSON格式，而是使用setState而不是useState。

我认为您应该重组模型，为什么不对状态变量answers使用对象，就像这样：

const [answers, setAnswers] = useState({});

const handleCheckbox = (e, question) => {
  const id = question.uuid;
  const value = e.target.id; // Maybe you could use e.target.value or e.target.name

  setAnswers(prevAnswers => ({
     ...prevAnswers,
     [id]: value
  }));
};

使用React Hooks更新状态数组

1 个答案: