1,悬浮关闭按钮
<div className="ant-drawer-footer" style={
{
width: '600' }}>
<Button style={
{
marginLeft: 8 }} onClick={
this.props.onClose}>
关闭
</Button>
</div>
2,抽屉的关闭按钮
closable={
true} // 小叉叉
maskClosable={
true}
destroyOnClose={
true}
3,从表单获取id
一般回显的id给修改的id附不上值时,从表单里获取id的值
id:this.props.form.getFieldValue('id')
name: this.props.form.getFieldValue('name')
{
getFieldDecorator('id', {
initialValue: this.props.id || ''
})(<Input type="hidden" />)}
4,实时验证
<Form.Item>
{
getFieldDecorator('name', {
validateTrigger: 'onBlur',
rules: [
{
required: true,
message: '请输入字典名称'
},
{
pattern: /^[^\s]*$/,
message: '不能输入空格'
},
{
pattern: /^[\u4e00-\u9fa5a-zA-Z0-9()()]+$/,
message: '不能输入特殊字符,只可以输入括号'
},
{
validator: this.inputOnBlurname
}
],
initialValue: this.props.name
})(<Input placeholder="字典名称" />)}
</Form.Item>
/**
* 校验字典名称是否重复
* @return {[type]} [description]
*/
inputOnBlurname = (rule, value, callback) => {
POST(HTTP_DEP + '/dict/isnotname', {
id: this.props.id,
pid: this.props.pid,
name: this.props.form.getFieldValue('name')
}).then(function