Reactjs 如何在Ant Design React表单中禁用字段?

Reactjs 如何在Ant Design React表单中禁用字段?,reactjs,antd,ant-design-pro,Reactjs,Antd,Ant Design Pro,我正在使用React withAnt Design,我想禁用一个表单。Itemusername字段。请参见下面的示例代码 <Form.Item disabled style={{ padding: '0px 20px' }}> {getFieldDecorator('username', { initialValue: this.state.userInfo.username, validate: [ {

我正在使用React withAnt Design,我想禁用一个表单。Itemusername字段。请参见下面的示例代码

<Form.Item disabled style={{ padding: '0px 20px' }}>
    {getFieldDecorator('username', {
        initialValue: this.state.userInfo.username,
        validate: [
            {
                trigger: ['onChange', 'onBlur'],
                rules: [
                    {
                        required: true,
                        message: t('pleaseInput.username'),
                    }
                ],
            },
        ],
    })
</Form.Item>

{getFieldDecorator('用户名'{
initialValue:this.state.userInfo.username,
验证:[
{
触发器:['onChange','onBlur'],
规则:[
{
要求:正确,
消息:t('plesseInput.username'),
}
],
},
],
})

您需要在
中显示某种类型的UI组件

我想你想显示一个
,因为你有一个用户名。下面是你的代码可以实现的功能:

<Form.Item disabled style={{ padding: '0px 20px' }}>
    {getFieldDecorator('username', {
        initialValue: this.state.userInfo.username,
        validate: [
            {
                trigger: ['onChange', 'onBlur'],
                rules: [
                    {
                        required: true,
                        message: t('pleaseInput.username'),
                    }
                ],
            },
        ],
    })(
        <Input
         // This is where you want to disable your UI control
         disabled={true}
         placeholder="Username"
        />
      )}
</Form.Item>

{getFieldDecorator('用户名'{
initialValue:this.state.userInfo.username,
验证:[
{
触发器:['onChange','onBlur'],
规则:[
{
要求:正确,
消息:t('plesseInput.username'),
}
],
},
],
})(
)}