Блог

Я новичок в реакциях. Я только что написал этот код, и функция onSubmit не работает. Я не понимаю, является ли это ошибкой регистрации или отправки формы.Может быть ошибка в этой строке, где записан тег формы.
Пожалуйста, направьте и дайте мне знать о решениях.версия react-hook-формы-7.14 Версия
React-17.02

FieldArray.js

 import React, { Fragment } from "react";
import { useForm } from "react-hook-form";
function FieldArray() {
  const { register, handleSubmit } = useForm();
  const basicform = (
    <div className="card">
      <div className="card-header">Basic Information</div>

      <div className="card-body">
        <div>
          <div className="form-group">
            <label htmlFor="fullname">Full Name</label>
            <input
              type="text"
              className="form-control"
              id="fullname"
              name="fullname"
              {...register("fullname")}
            />
          </div>
          <div className="form-group">
            <label htmlFor="email">Email address</label>
            <input
              type="email"
              className="form-control"
              id="email"
              name="email"
              {...register("email")}
            />
          </div>
          <div className="form-group">
            <label htmlFor="phone">Phone Number</label>
            <input
              type="text"
              className="form-control"
              id="phone"
              name="phone"
              {...register("phone")}
            />
          </div>
          <div className="form-group">
            <label htmlFor="password">Password</label>
            <input
              type="password"
              className="form-control"
              id="password"
              name="password"
              {...register("password")}
            />
          </div>
        </div>
      </div>
    </div>
  );

  const onSubmit = data => {
      console.log('hjhhhh');
      console.log(data);
  }

  return (
    <div className="App">
      <div className="container py-5">
        <form onSubmit={handleSubmit(onSubmit)}>{basicform}</form>
        <button className="btn btn-primary" type="submit">Submit</button>
      </div>
    </div>
  );
}

export default FieldArray;
 

Мы должны завернуть кнопку «Отправить» внутри тега формы

 <form onSubmit={handleSubmit(onSubmit)}>
          {basicform}
          <button className="btn btn-primary" type="submit">
            Submit
          </button>
        </form>
 

Песочница — https://codesandbox.io/s/silly-cori-t94eu?file=/src/react-hook-form.jsx