时间戳

首页 > 解决方案 > 做出反应。未处理的拒绝（TypeError）：无法读取未定义的属性“值”

javascript - 做出反应。未处理的拒绝（TypeError）：无法读取未定义的属性“值”

问题描述

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

未处理的拒绝（TypeError）：无法读取 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);
  };

标签： javascripthtmljsonreactjs

解决方案

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

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

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

推荐阅读