Reactjs 尝试使用React中的钩子函数清除所有表单字段。向onClick事件添加对象

我在一个小React项目中创建了以下钩子。 从“react”导入{useState}

现在在我的App.js中，我已经导入了钩子。下面的代码使用钩子填充表单

import React from "react";
import useInputHook from "../Hooks/useFormState";
function App() {
const [name, setName, resetName] = useInputHook("");
const [surname, setSurname, resetSurname] = useInputHook("");
const [email, setEmail, resetEmail] = useInputHook("");

return (
<div className="container">
  <h1>
    Hello {name} {email}
  </h1>
  <h2>{email}</h2>
  <input
    onChange={setName}
    type="text"
    placeholder="What's your name?"
    value={name}
  />
  <input
    onChange={setSurname}
    type="text"
    placeholder="What's your surname?"
    value={surname}
  />
  <input
    onChange={setEmail}
    type="text"
    placeholder="What's your email?"
    value={email}
  />
  <button onClick={resetName} {resetSurname} {resetEmail}>Submit</button>
  </div>
 );
 }

我遇到的这个问题是在onClick事件中使用resetName、reset姓氏和resetEmail。 清除表单字段。我得到以下

error/src/components/App.jsx：意外标记，预期“…”（41:35）

下面是表单的代码

import React from "react";
import useInputHook from "../Hooks/useFormState";
function App() {
const [name, setName, resetName] = useInputHook("");
const [surname, setSurname, resetSurname] = useInputHook("");
const [email, setEmail, resetEmail] = useInputHook("");

return (
<div className="container">
  <h1>
    Hello {name} {email}
  </h1>
  <h2>{email}</h2>
  <input
    onChange={setName}
    type="text"
    placeholder="What's your name?"
    value={name}
  />
  <input
    onChange={setSurname}
    type="text"
    placeholder="What's your surname?"
    value={surname}
  />
  <input
    onChange={setEmail}
    type="text"
    placeholder="What's your email?"
    value={email}
  />
  <button onClick={resetName} {resetSurname} {resetEmail}>Submit</button>
  </div>
 );
 }

返回(
你好{name}{email}
{email}
提交
);
}

---

任何帮助都将不胜感激。

您已导出为

[值、重置函数、更改处理程序]

并作为

[值、更改处理程序、重置功能]

导入（顺序错误）

底部的重置按钮应激活所有重置功能，如下所示：

resetName（）；重置姓氏（）；重置电子邮件（）；}>提交

• 如果您在按钮中设置这样的功能，它们将成为按钮的道具，而不会在onClick启动时执行。 这是错误的：

  Submit

您可以尝试创建一个函数重置数组或使用useEffect清理函数

---

反应愉快

我仍然在onClick事件中遇到相同的错误。不幸的是，我遇到了这个错误

×SyntaxError/src/components/App.jsx：意外的标记，预期为“}”

，这是因为要么你的括号放错了位置，要么你的道具中仍然有语法错误的按钮标记，请添加完整的源代码，如果你仍然得到Stuck你有完整的源代码。这就是我编写onClick事件的方式。

resetName（）；重置姓氏（）；resetEmail（）}>提交