iview 中自定義手機號表單驗證

1.在組件的data裏 聲明驗證規則: javascript

const validatePhone = (rule, value, callback) => {
            if (!value) {
                return callback(new Error('手機號不能爲空'));
            } else if (!/^1[34578]\d{9}$/.test(value)) {
                callback('手機號格式不正確');
            } else {
                callback();
            }   
        };
//注意:在return外面

2.在表單驗證規則裏使用java

ruleValidate: {
                account: [
                    { required: true, message: '登陸帳戶不能爲空', trigger: 'blur' }
                ],
                mobile: [
                    { required: true,validator:validatePhone,trigger:'blur'}
                ],
                name: [
                    { required: true, message: '用戶暱稱不能爲空', trigger: 'blur' }
                ]
            },

注意:表單添加校驗時,須要給 Form 設置屬性 rules,即  「:rules="ruleValidate"」,
同時給須要驗證的 FormItem 設置屬性 prop 指向對應字段,即 「:prop="mobile」。 ui

相關文章
相關標籤/搜索