主页 / 问题 / 1294915
Accepted
Zhenyria
Asked:2022-06-14 03:33:48 +0000 UTC2022-06-14 03:33:48 +0000 UTC

如何在没有提交按钮的情况下提交表单？

  • 772

我也使用React图书馆redux-form。我想制作一个将在事件中发送的表格onBlur。有一个组件：

const UpdateTargetForm = ({handleSubmit, error, close}) => {
    return (
        <form onSubmit={handleSubmit}>
            <Field name={"field"} component={"input"} onBlur={???}/>
        </form>
    )
}

我应该写什么函数onBlur来提交表单？

javascript

1 个回答

  1. Best Answer

    在 onBlur 中写什么函数来提交表单？

    你写的表单提交函数一行。

    <form onSubmit={handleSubmit}>
     <Field name={"field"} component={"input"} onBlur={handleSubmit/>
</form>

    这是没有库的工作代码：

    export default function App() {
  const [value, setValue] = useState("");
  const submitForm = (e) => {
    e.preventDefault();

    console.log("submits", value);
  };
  return (
    <div className="App">
      <form onSubmit={submitForm}>
        <input
          {...{ value }}
          onBlur={submitForm}
          onChange={(e) => setValue(e.target.value)}
        />
      </form>
    </div>
  );
}

    带有 redux-form Codesandbox的UPD示例

    import { Field, reduxForm } from "redux-form";

let App = () => {
  const handleSubmit = (e) => {
    e.preventDefault();
    console.log("submit");
  };
  return (
    <div className="App">
      <form onSubmit={handleSubmit}>
        <Field name={"field"} component={"input"} onBlur={handleSubmit} />
      </form>
    </div>
  );
};

export default App = reduxForm({
  form: "contact"
})(App);
    • 0

相关问题