antd 不用form onsubmit 如何完成必填項(xiàng)的校驗(yàn)

我是這么寫(xiě)的：

    <Modal
        title={<span className="AddManagement">新增設(shè)備</span>}
        visible={this.state.visible}
        onOk={this.handleOk}
        onCancel={this.handleCancel}
        footer=""http://會(huì)讓自帶的取消 確定 按鈕消失
    >
     <Form >
<FormItem
    label="設(shè)備類(lèi)型編號(hào)"
    labelCol={{ span: 6 }}
    wrapperCol={{ span: 16 }}
>
    {getFieldDecorator('code', {
        rules: [{ required: true, message: '請(qǐng)輸入設(shè)備類(lèi)型編號(hào)!' }],
    })(
        <Input />
    )}
</FormItem>
      <FormItem
    wrapperCol={{ span: 16, offset: 10 }}
>
    <Button type="primary" onClick={this.state.save？this.submit:this.putSubmit}>
        保存提交
    </Button>
</FormItem>
        </Form>
    </Modal>

現(xiàn)在的問(wèn)題是我在新增數(shù)據(jù)的時(shí)候沒(méi)有填入任何數(shù)據(jù)，點(diǎn)擊保存的時(shí)候向后臺(tái)發(fā)送，沒(méi)有觸發(fā)必填項(xiàng)的校驗(yàn)，是因?yàn)槲覜](méi)有用 onsubmit 事件的緣故嗎。
效果圖：圖片描述

回答

編輯回答

檸檬藍(lán)

不用，在handleOk函數(shù)時(shí)，可以做校驗(yàn)!

 handleOk = (e) => {
        const self = this;
        this.props.form.validateFields((errors, values) => {
            if (!!errors) {
                console.log(errors);
                return;
            };
          
            this.setState({
                visible: false,//關(guān)閉modal

            });
           //提交調(diào)的接口
        })


    };

2017年8月26日 11:02

編輯回答

陌上花

使用自定義校驗(yàn):

https://ant.design/components...

脫離 Form.create(), 然后在 render() 中執(zhí)行校驗(yàn)函數(shù).

2017年5月26日 06:06

編輯回答

礙你眼

其實(shí)這個(gè)問(wèn)題和onsubmit 沒(méi)有什么關(guān)系，是我自己學(xué)藝不精，要校驗(yàn)必填選項(xiàng)，可以在方法中添加

function a (e){
    e.preventDefault();//***
    this.props.form.validateFields((err) => {//***
          if (err) {
              return;
          }
          axios();
 }

2017年2月12日 22:38