“React Hook Controller Walidacja formularza” Kod odpowiedzi

Wybierz React Hook Form Walidacja YUP

import React from "react";
import ReactDOM from "react-dom";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import * as yup from "yup";

import "./styles.css";

const SignupSchema = yup.object().shape({
  select: yup.string().required()
});

function App() {
  const {
    register,
    setValue,
    handleSubmit,
    formState: { errors }
  } = useForm({
    mode: "onChange",
    resolver: yupResolver(SignupSchema)
  });
  const onSubmit = (data) => {
    alert(JSON.stringify(data));
  };

  const doSomething = async (value) => {
    // do something with my select value onChange
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <div>
        <label>Select</label>
        <select
          {...register("select")}
          onChange={(e) => setValue('select', e.target.value, { shouldValidate: true })} // Using setValue
        >
          <option value="">Null</option>
          <option value="1">1</option>
          <option value="2">2</option>
        </select>
        {errors.select && <p>{errors.select.message}</p>}
      </div>
      <input type="submit" />
    </form>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
shashanka a

React Hook Controller Walidacja formularza

              rules={{
                required: {
                  value: required,
                  message: 'This field is required',
                },
                validate: {
                  fileType: (file) =>
                    !required ||
                    validFileTypes.indexOf(file.type) != -1 ||
                    'We only support (pdf, doc, docx, txt, rtf)',
                },
              }}
Grotesque Gerbil

Odpowiedzi podobne do “React Hook Controller Walidacja formularza”

Pytania podobne do “React Hook Controller Walidacja formularza”

Więcej pokrewnych odpowiedzi na “React Hook Controller Walidacja formularza” w JavaScript

Przeglądaj popularne odpowiedzi na kod według języka

Przeglądaj inne języki kodu