Question

我从对象动态生成表单。

我的表格上有两个字段：复选框pickup_allowed和Zip文本输入。

只有在选中pickup_allowed时，zip文本才是必填项且可见。

如何使用redux-form显示或不显示zip文本输入并对js做出反应？

const sellingFormFieldDescription = [
  {
    key: 'pickup_allowed',
    type: 'checkbox',
    checkRules: {
      mandatory: false
    } 
  },
  {
    key: 'zip_code',
    type: 'integer',
    checkRules: {
      minValue: 1,
      maxValue: 99999,
      maxLength: 5,
      mandatoryAndVisibleIf: { 
        key: 'pickup_allowed', 
        checked: true
      }
    }
  }
]

class SellingFormFast extends Component {
  render() {
    { sellingFormFieldDescription.map((field,i) => {
      const validate = applyRules(field.checkRules);
      if(field.type === 'checkbox' ){
        return <Field name={field.key} key={i} component={renderCheckbox} validate={validate} />
      } else if (field.type === 'integer') {
        return <Field name={field.key} key={i} component={renderField} validate={validate}/>
      }});
    }
  }
}

export default reduxForm({form: 'sellling_form_fast'})(SellingFormFast)

有条件地根据JS / redux-form

0 个答案: