使用 React Hook 加载页面时自动提交表单

Auto submits the form when the page is loaded using React Hook

  1. 当页面加载时,我想自动增加1
  2. 当页面完全加载后,我想自动提交表单而无需单击提交按钮

我之所以这样做,是因为我打算与我自己的 Cron Job 一起使用。提前致谢。

请指导我如何处理?

import firebase from "@config/firebase.config";
import "firebase/firestore";

import { useState, useEffect, useRef } from "react";

// TODO: Main Form UI
const FormData = ({ justDummy }) => {
  // TODO: FORM REF
  const formRef = useRef(null);

  const handleSubmit = (e) => {
    e.preventDefault();
  };

  useEffect(() => {
    // * This didn't work!
    // formRef.current.submit()
  }, []);

  return (
    <>
      <ScopedCssBaseline />
      <form onSubmit={handleSubmit} ref={formRef} autoComplete="off">
        <form onSubmit={handleSubmit} ref={formRef} autoComplete="off">
          <Box sx={{ display: "flex", mt: 3 }}>
            <TextField
              onChange={() => console.log("")}
              value={id}
              type="number"
              placeholder="100"
              variant="outlined"
              fullWidth
              size="small"
              required
              color="primary"
              label="ID"
              disabled
            />
            <Box sx={{ mx: 0.5 }} />
            <TextField
              onChange={() => console.log("")}
              value={currentDate}
              placeholder="Current Date"
              variant="outlined"
              fullWidth
              size="small"
              color="primary"
              label="Date"
              disabled
            />
          </Box>
          <Box sx={{ mt: 1 }}>
            <Button
              type="submit"
              fullWidth
              variant="outlined"
              color="primary"
              disabled
            >
              Submit Data
            </Button>
          </Box>
        </form>
      </form>
    </>
  );
};

export default FormData;

我已经解决了那个问题。我删除了 onSubmit 函数并替换为使用 React Ref 然后使用 Ajax.