鍍金池/ 問答/HTML/ 關(guān)于 ant design mobile 表單驗(yàn)證的 getFieldProps

關(guān)于 ant design mobile 表單驗(yàn)證的 getFieldProps問題

如何寫出自定義驗(yàn)證規(guī)則？

 <List renderHeader={() => 'test'}>
                        <InputItem
                            {...getFieldProps('phone',{rules: [{required: true,message:"123"}],})}
                            type="phone"
                            placeholder="input your phone"
                            error={getFieldError('phone')?true:false}
                        >手機(jī)號(hào)碼</InputItem>
    
                    </List>

現(xiàn)在的規(guī)則是必填，當(dāng)然也可以用其他的定義好的規(guī)則 比如 type：string子類的，
但是可以設(shè)置自定義的驗(yàn)證函數(shù)嗎？

回答
編輯回答
誮惜顏

當(dāng)然可以，使用validate方法就可以了。在文檔中有鏈接。

2017年4月20日 02:37
編輯回答
局外人

驗(yàn)證不是這樣寫的，類似這種

const { getFieldDecorator } = this.props.form;

<FormItem {...formItemLayout} label="Name">
  {getFieldDecorator('username', {
    rules: [{
      required: true,
      message: 'Please input your name',
    }],
  })(
    <Input placeholder="Please input your name" />
  )}
</FormItem>
2017年2月20日 02:21
編輯回答
薔薇花
            <InputItem
                {...getFieldProps('phone',{rules: [
                    {required: true,message:"必填啊"},
                    {validator(rule, value, callback, source, options){
                        var errors = [];
                        console.log(value,"Xx")
                        if(value==1){
                            callback("wocao  111");
                        }else{
                            callback(errors);
                        }

                    }}

                ],})}
                type="phone"
                placeholder="input your phone"
                error={getFieldError('phone')?true:false}
            >手機(jī)號(hào)碼</InputItem>

getFieldDecorator 和 getFieldProps相似 只是寫法不同。
https://github.com/react-comp...

自定義驗(yàn)證就是參數(shù) validator
圖片描述

2018年4月25日 21:25