如何使用react hook form和yup验证密码和确认密码

npm install react-hook-form yup

import React from 'react';
import { useForm } from 'react-hook-form';
import * as yup from 'yup';

const schema = yup.object().shape({
  password: yup
    .string()
    .required('密码不能为空')
    .min(6, '密码长度不能少于6位'),
  confirmPassword: yup
    .string()
    .oneOf([yup.ref('password'), null], '确认密码必须与密码相同')
    .required('确认密码不能为空'),
});

function App() {
  const { register, handleSubmit, errors } = useForm({
    resolver: yupResolver(schema),
  });

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

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <div>
        <label>密码</label>
        <input type="password" name="password" ref={register} />
        {errors.password && <p>{errors.password.message}</p>}
      </div>
      <div>
        <label>确认密码</label>
        <input type="password" name="confirmPassword" ref={register} />
        {errors.confirmPassword && <p>{errors.confirmPassword.message}</p>}
      </div>
      <button type="submit">提交</button>
    </form>
  );
}