javascript - 在发布请求后获取数据将带回旧数据

Question

这是我在这里的第一个问题，我只玩了几个月的网络技术，所以我要问的问题可能是微不足道的，但我似乎无法自己解决这个问题。

我在这里要做的是打开一个模式并使用一个表单将一些数据发布到我的快递后端。在我从服务器获得响应后，我通过 props 将其发送到父组件。

const CreateAccount = (props) => {
  // context
  const authContext = useContext(AuthContext);

  const [accountType, setAccountType] = useState("standard");
  const [accountCurrency, setAccountCurrency] = useState("ron");

  const { post, loading, error } = useFetch(process.env.REACT_APP_BACKEND, {
    headers: { Authorization: `Bearer ${authContext.token}` },
  });

  const handleFormSubmit = async (e) => {
    e.preventDefault();

    const response = await post("/accounts", { accountType, accountCurrency });
    console.log(response.data);
    props.setHttpResponse(response.message);

    // if modal is given, close it after submiting the form
    props.closeModal && props.closeModal();
  };

响应由消息和更新的文档组成。一切正常，文档正确保存在数据库中，我得到了预期的响应，并且父组件在响应发送后重新呈现

在父组件中，我有 useEffect 函数，该函数应该在组件第一次安装时以及每次设置来自模态的响应时获取数据（所以无论我在哪里发送发布请求）。组件确实重新呈现，我从服务器得到响应，但问题是我得到的响应是旧响应，而不是更新的响应，其中包含在我之前发送的发布请求中设置的新数据模态的。

const InitializedPage = () => {
  Modal.setAppElement("#modal");
  // context
  const authContext = useContext(AuthContext);
  const [userData, setUserData] = useState({});
  const [createAccountResponse, setCreateAccountResponse] = useState(""); // the response i get from the modal after i send post request to the server
  const { loading, get } = useFetch(process.env.REACT_APP_BACKEND, {
    headers: {
      Authorization: `Bearer ${authContext.token}`,
      "Cache-Control": "no-cache",
    },
  });

  // get data for specific user
  useEffect(() => {
    const { userId } = authContext.userData;
    (async () => {
      const response = await get(`/users/${userId}`);
      console.log(response); // here the response is the old one whenever the component rerenders
      setUserData(response.userData);
    })(); 
  }, [get, authContext, createAccountResponse]);

如果有人可以，请告诉我我错过了什么或我在这里做错了什么？

编辑：我忘了补充一点，如果我刷新页面，我将获得更新的数据。

标签： javascriptreactjsexpress