Getting TypeError: Cannot read property 'prototype' of undefined after modifying form

Question

我目前正在使用 node.js、express 和 ReactJs 开发一个应用程序。我也使用 sequelize 作为我的 ORM。我正在处理我的表单，该表单最初将空值发送到我的数据库，从那时起我就被这个错误困住了几天。我在我的前端 ReactJs 上得到以下信息：

TypeError: 无法读取未定义的属性 'prototype''

我知道这个错误非常模糊，发生的原因有很多。对我来说，这发生在我处理 form.I 时，我正在使用 useStates 设置我的值并使用 axios 处理 post 请求。我在哪里宣布我的州：

  let [state, setState] = useState({
    leadName: "",
    excellentLead: ""
  });

handleChange(evt) function:Used 根据我的输入处理更改。

  function handleChange(evt) {
    const value = evt.target.value;

    axios({
      method: "post",
      url: "http://localhost:5000/add",
      data: body,
    })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    setState({
      ...state,
      [evt.target.name]: evt.target.value,
    });

当前形式（我正在使用 React Bootstrap 进行样式设置。）：

            <Form onSubmit={handleChange}>
              <Form.Group controlId="formBasicName">
                <Form.Label>Name</Form.Label>
                <Form.Control
                  type="text"
                  placeholder="Enter Name"
                  name="leadName"
                  value={state.leadName}
                  onChange={handleChange}
                />
              </Form.Group>

              <Form.Group controlId="formBasicFollowUp">
                <Form.Label>
                  Excellent Lead Worth following up(Yes/No/Maybe)
                </Form.Label>
                <Form.Control
                  type="text"
                  placeholder="Enter Name"
                  name="excellentLead"
                  value={state.excellentLead}
                  onChange={handleChange}
                />
              </Form.Group>
               <Button variant="primary" type="submit">
                Submit
              </Button>
            </Form>

在我的 server.js 中，这是我的 post 路线：

app.post('/add', function(request, response) {
  Information.create({
    Name:req.body.leadName,
    ExcellentLeadWorthFollowingUp:req.body.excellentLead
  }).then(function(Information){
    res.json(Information);
  })
})

我从前端连接到数据库没有任何问题，我的 post 方法用于在单击按钮时发送空值，这不是目标。补充一下，这个错误破坏了我的整个程序。

如有任何建议、解释或链接，我们将不胜感激！

Answer 1

从'express'导入{响应}；被导入并导致了整个错误....经典。

Answer 2

既然你已经修复了你的错误，我想让你知道你每次输入更改时都会调用 handleChange。这意味着您每次在输入中键入一个字符时都会发出 POST 请求。

更好的方法是只在提交时 post。

import React, { useState } from "react";

const App = () => {
  const [data, setData] = useState({ name: "", age: "" });

  const handleChange = (e, field) => {
    e.preventDefault(); // prevent the default action

    // set your data state
    setData({
      ...data,
      [field]: e.target.value
    });
  };

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

    // axios post data

    console.log(data); // just for showing
  };

  return (
    <div>
      <p>Fill in data</p>
      <form onSubmit={handleSubmit}>
        <input
          type="text"
          value={data.name}
          onChange={(e) => handleChange(e, "name")}
        />
        <input
          type="text"
          value={data.age}
          onChange={(e) => handleChange(e, "age")}
        />
        <button type="submit">SUBMIT</button>
      </form>
    </div>
  );
};

export default App;

Getting TypeError: Cannot read property 'prototype' of undefined after modifying form

Getting TypeError: Cannot read property 'prototype' of undefined after modifying form

node.js

express

sequelize.js

reactjs

use-state