发布于 4年前

Ant Design form里被隐藏的内容如何不提交?

我有一个表单有2个单选扭 是和否,2个div 隐藏用。

我选择是的时候提交只提交显示是那一块的div,选择否就提交否的。

<Form.Item label='上门提货' >
                  {getFieldDecorator('tihuo', {
                    rules: [{ required: true }],
                    initialValue: "true"
                  })(
                    <Radio.Group onChange={e => this.onRadioChange(e)} >
                      <Radio value="true" >是</Radio>
                      <Radio value="false">否</Radio>
                    </Radio.Group>
                  )}
 </Form.Item>

  <div style={{ display: this.state.display_name==='block'?'block' :'none' }}>
        <Form.Item label='提货地址' >
                    {getFieldDecorator('name', {
                      rules: [{ required: true, message: '提货地址' }],
                    })(
                      <Select placeholder="请选择提货地址">
                        <Option value="xiao">宝安</Option>
                        <Option value="mao">龙岗</Option>
                      </Select>
                    )}
        </Form.Item>
</div>

解决方案:

this.onRadioChange方法里添加this.setState({xxx:xxx})

根据你选的值设一个state

const 表1=(<..>)
const 表2=(<..>)

下面2个div的地方换成{this.state.xxx?表1:表2}

©2020 edoou.com   京ICP备16001874号-3