Javascript 如何利用useFormik挂钩的无线组

我试图让useFormik验证无线组，但它似乎不起作用，下面是我正在做的一个简单示例，每当我在检查任何无线输入后提交表单时，formik抛出验证错误（{currState:“您必须选择属性状态”}），即使我选择了一个选项。 我意识到getFieldProps将值字段附加到收音机，所以我尝试使用defaultValue，然后react在选择受控和非受控组件时抛出错误

     import { useFormik } from "formik"
     export function ListProperty(){
     const { handleSubmit, getFieldProps, touched, errors } = useFormik(
             {
           initialValues: {
            currState:"",
          },
      validationSchema:Yup.object().shape({
         currState:Yup.string().required("you must choose property state")
     }),
     return (
        <form onSubmit={handleSubmit} >

         <div className="form-group inline">
            <div className="form-control">
              <input type="radio" 
              name="currState"  
              {...getFieldProps("currState")} 
              value="serviced" 
              />
              <label>serviced</label>
            </div>

            <div className="form-control">
              <input 
              type="radio" 
              value="furnished" 
              name="currState"  
              {...getFieldProps("currState")} 
              />
              <label>furnished</label>
            </div>

            <div className="form-control">
              <input
                type="radio"
                value="newlybuilt"
               name="currState"  
              {...getFieldProps("currState")} 
              />
              <label>newly built</label>
            </div>

          </div>
           <button type="submit">submit </button>
           </form>
     )
   }

从“formik”导入{useFormik}
导出函数ListProperty（）{
const{handleSubmit，getFieldProps，toucted，errors}=useFormik(
{
初始值：{
咖喱酸：“，
},
validationSchema:Yup.object（）.shape({
currState:Yup.string（）.required（“您必须选择属性状态”）
}),
返回(
服务
带家具的
新建
提交
)
}

您可以尝试这样做。它应该可以工作。getFieldProps（“currState”）似乎覆盖了值属性，而不提供选中的属性

import { useFormik } from "formik"
     export function ListProperty(){
     const { handleSubmit, getFieldProps, touched, errors,
             values, handleChange } = useFormik({
            initialValues: {
             currState:"",
            },
            validationSchema:Yup.object().shape({
              currState:Yup.string().required("you must choose property state")
            }),
     return (
        <form onSubmit={handleSubmit} >

         <div className="form-group inline">
            <div className="form-control">
              <input type="radio" 
              name="currState"  
              checked={values.currState === 'serviced'}
              onChange={handleChange}
              value="serviced" 
              />
              <label>serviced</label>
            </div>

            <div className="form-control">
              <input 
              type="radio" 
              value="furnished" 
              name="currState"  
              checked={values.currState === 'furnished'}
              onChange={handleChange}
              />
              <label>furnished</label>
            </div>

            <div className="form-control">
              <input
                type="radio"
                value="newlybuilt"
                name="currState"  
                checked={values.currState === 'newlybuilt'}
                onChange={handleChange}
              />
              <label>newly built</label>
            </div>

          </div>
           <button type="submit">submit </button>
           </form>
     )
   }

从“formik”导入{useFormik}
导出函数ListProperty（）{
const{handleSubmit，getFieldProps，toucted，errors，
值，handleChange}=useFormik({
初始值：{
咖喱酸：“，
},
validationSchema:Yup.object（）.shape({
currState:Yup.string（）.required（“您必须选择属性状态”）
}),
返回(
服务
带家具的
新建
提交
)
}

您可以尝试这样做。它应该可以工作。getFieldProps（“currState”）似乎覆盖了值属性，而不提供选中的属性

import { useFormik } from "formik"
     export function ListProperty(){
     const { handleSubmit, getFieldProps, touched, errors,
             values, handleChange } = useFormik({
            initialValues: {
             currState:"",
            },
            validationSchema:Yup.object().shape({
              currState:Yup.string().required("you must choose property state")
            }),
     return (
        <form onSubmit={handleSubmit} >

         <div className="form-group inline">
            <div className="form-control">
              <input type="radio" 
              name="currState"  
              checked={values.currState === 'serviced'}
              onChange={handleChange}
              value="serviced" 
              />
              <label>serviced</label>
            </div>

            <div className="form-control">
              <input 
              type="radio" 
              value="furnished" 
              name="currState"  
              checked={values.currState === 'furnished'}
              onChange={handleChange}
              />
              <label>furnished</label>
            </div>

            <div className="form-control">
              <input
                type="radio"
                value="newlybuilt"
                name="currState"  
                checked={values.currState === 'newlybuilt'}
                onChange={handleChange}
              />
              <label>newly built</label>
            </div>

          </div>
           <button type="submit">submit </button>
           </form>
     )
   }

从“formik”导入{useFormik}
导出函数ListProperty（）{
const{handleSubmit，getFieldProps，toucted，errors，
值，handleChange}=useFormik({
初始值：{
咖喱酸：“，
},
validationSchema:Yup.object（）.shape({
currState:Yup.string（）.required（“您必须选择属性状态”）
}),
返回(
服务
带家具的
新建
提交
)
}