5

我有一个 react formik 表单,其中有一个选择字段,例如该字段的值 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');
   }
  }),

但这段代码不起作用。

现在,我要在这里进行哪些更改才能使这项工作按我的意愿进行?

4

3 回答 3

6

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

chooseSubType: yup.string().when('chooseAlphabet', {
  is: 'B',
  then: schema => schema,
  otherwise: yup.string().when('type', {
    is: 'D',
    then: yup.string().required('field required.')
  })
})
于 2019-07-19T12:36:25.037 回答
4

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

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');
    }
}),
于 2020-10-21T12:06:33.450 回答
2

对你来说,第二个参数模式是未定义的。

 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');
           }
          }),
于 2020-08-19T18:13:32.967 回答