是的验证：选择至少一个单选按钮

问题描述

我想为两个不同命名的单选按钮（称为 test 和 testTwo）提供验证，其中必须至少选择一个，否则验证失败。我添加了一个测试，在这种情况下应该使 isValid 变量失败，但由于某种原因，如果只在 nameTwo 字段中输入内容，它仍然显示为有效。

这是我的代码：

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

const App = () => {
  const {
    register,handleSubmit,watch,errors,formState: { isValid }
  } = useForm();
  const onSubmit = async data => {
    console.log('form data',data);
    const isValid = await schema.isValid(schema);
  };

  return (
    <>
      {console.log('isValid',isValid)}
      {console.log('errors',errors)}
      <form onSubmit={handleSubmit(onSubmit)}>
        <input name="name" defaultValue="test" ref={register} />

        <input name="nameTwo" ref={register({ required: true })} />
        {errors.examplerequired && <span>This field is required</span>}

        <label>
          <input name="test" type="radio" ref={register} value="test" />
        </label>

        <label>
          <input name="testTwo" type="radio" ref={register} value="testTwo" />
        </label>

        <input type="submit" />
      </form>
    </>
  );
};

const schema = yup.object().shape({
  name: yup.string(),nameTwo: yup.string().required(),test: yup.string(),testTwo: yup.string()
}).test('at-least-one-radio',"you must select at least one radio",value =>
  !!(value.test || value.testTwo));

export default App;

如何获得验证以要求至少选中一个单选按钮？

Stackblitz 演示：https://stackblitz.com/edit/react-lom8mg

另外，我假设失败的验证应该成为错误变量的一部分，对吗？ （所以收音机应该在那个变量中）

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）