反应。未处理的拒绝（类型错误）：无法读取未定义的属性“值”

Question

你好 请帮我将表格发送到电子邮件！

未处理的拒绝（类型错误）：无法读取未定义的属性“值” const handleSubmit 上的错误

是源代码：

 const Form = () => {
  const classes = useStyles();
  const [status, setStatus] = useState("Submit");
  const handleSubmit = async (e) => {
    e.preventDefault();
    setStatus("Sending...");
    const { name, email, message } = e.target.elements;
    let details = {
      name: name.value,
      email: email.value,
      message: message.value,
    };
    let response = await fetch("http://localhost:5000/contact", {
      method: "POST",
      headers: {
        "Content-Type": "application/json;charset=utf-8",
      },
      body: JSON.stringify(details),
    });
    setStatus("Submit");
    let result = await response.json();
    alert(result.status);
  };

Answer 1

似乎：姓名、电子邮件和消息是 undefined/null。我们需要查看您的渲染功能。 （也许您忘记在输入中添加 name 属性？）

您可以改用表单元素，并创建 FormData：

const elements = new FormData(e.target);
const details = {
  name: elements.get("name"),
  email: elements.get("email"),
  message: elements.get("message"),
};