需要基于另一个字段的值的字段 - formik，是的

Question

我有一个反应形式， 其中有一个选择字段， 假设该字段的值为 A、B、C、D、E、F。

现在说，另一个字段 ChooseSubType 仅在我选择 B 或 D 时才显示，并且该字段仅在显示时才是必填字段，而不是在此之前。

现在，我该如何做到这一点？

这是第一个字段的代码，即选择字段

chooseAlphabet: Yup.string().required('field required'),
chooseSubType : Yup.string().when('chooseAlphabet',
('chooseAlphabet',schema)=>{
   console.log('value business : ',chooseAlphabet);
   if(chooseAlphabet === "B"||"D"){
     return schema;
   }else{
     return schema.required('field required');
   }
  }),

但此代码不起作用。

现在，我需要进行哪些更改才能使这项工作按我的意愿进行？

Answer 1

我知道有点晚了，但你可以试试这个

chooseSubType: yup.string().when('chooseAlphabet', {
  is: 'B',
  then: schema => schema,
  otherwise: yup.string().when('type', {
    is: 'D',
    then: yup.string().required('field required.')
  })
})

Answer 2

您可以使用相同的代码，只是需要添加一些改进 请检查下面的代码。

chooseAlphabet: Yup.string().required('field required'),
chooseSubType : Yup.string().when('chooseAlphabet',
(chooseAlphabet,schema)=>{
    console.log('value business : ',chooseAlphabet);
    if(chooseAlphabet === "B"||"D"){
       return schema;
    }else{
       return schema.required('field required');
    }
}),

Answer 3

对于您来说，第二个参数架构未定义。

 chooseAlphabet: Yup.string().required('field required'),
        chooseSubType : Yup.string().when('chooseAlphabet',
        (chooseAlphabetValue)=>{
           console.log('value business : ',chooseAlphabetValue);
           if(chooseAlphabetValue=== "B"||"D"){
             return Yup.string();
           }else{
             return Yup.string().required('field required');
           }
          }),

Answer 4

第一个参数应该是数组。下面的代码应该可以工作。注意第一个参数，我将其更改为

[chooseAlphabet]

chooseAlphabet: Yup.string().required('field required'),
chooseSubType : Yup.string().when('chooseAlphabet',
([chooseAlphabet],schema)=>{
   console.log('value business : ',chooseAlphabet);
   if(chooseAlphabet === "B"||"D"){
     return schema;
   }else{
     return schema.required('field required');
   }
  }),

https://www.npmjs.com/package/yup#schemawhenkeys-string--string-builder-object--values-any-schema--schema-schema