在带有钩子的函数处理程序中使用 useRef

设置状态是一个异步操作，更新后的状态只会在下一次渲染时可用。

在您的情况下，默认状态是 undefined，这是您在第一次提交时发送的内容。状态现在更新了，当你再次提交时，你发送之前的答案，依此类推...

为了解决这个问题，准备一个const(newAnswer)，并将其设置为state，并在api调用中使用。

注意：就您而言，您根本没有使用 surveyUserAnswers，因此您可以完全删除此状态。

const onSubmitSurvey = (e: React.FormEvent): void => {
  e.preventDefault();
  setLoading((prevLoading) => !prevLoading);

  const newAnswer = {
    id: Math.random(),answers: [
      progrAMMerTypeQRef.current!.value,skillsQRef.current!.value,stateManagementQRef.current!.value,progrAMMerTypeQRef.current!.value,],}

  setSurveyUserAnswers(newAnswer);

  axios
    .post(`${DB_URL}/users-answers.json`,newAnswer)
    .then((res) => {
      setLoading((prevLoading) => !prevLoading);
    })
    .catch((error) => {
      console.log(error);
      setLoading((prevLoading) => !prevLoading);
    });
};