對輸入的表單內容自定義校驗

自定義校驗可以大致分為三種：

1.確認密碼

在輸入確認密碼的時候，需要判斷當前輸入的密碼與上面的密碼是否一樣，若是為空，則提示：請再次輸入密碼；若是與上次輸入的不一致，則提示：兩次輸入密碼不一致；否則，不顯示提示信息，即輸入正確。

password2: [
    { required: true, validator: validatePass2, trigger: 'blur' }
]

var validatePass2 = (rule, value, callback) => {
    if (value === '') {
        callback(new Error('請再次輸入密碼'));
    } else if (value !== this.form.password1) {
        callback(new Error('兩次輸入密碼不一致!'));
    } else {
        callback();
    }
};

2.需要請求接口判斷是否輸入數據已存在

判斷用戶名是否已存在，需要請求接口，通過后端查詢數據庫，根據返回的狀態值來決定數據庫中是否存在該用戶名，從而確定提示信息。

userName: [
    { required: true, validator: validateName,  trigger: 'blur' },
],

var validateName = (rule, value, callback) => {
    let params = {
            loginName: value,
        };
        params = this.$qs.stringify(params,{ indices: false });
        this.axios({
            method:'post',
            url:window.API_HOST+'/login/checkName',
            data:params
        }).then((res)=>{
        this.userNameData = res.data.status;
        if (value == '') {
            callback(new Error('請輸入用戶名'));
        } else if (this.userNameData == '500') {
            callback(new Error('用戶名已存在'));
        } else {
            callback();
        }
    })
};

3.通過正則表達式對輸入的內容進行校驗，自定義規則

可以自定義校驗規則，如： 格式“BIL1100”，規則：前三位是字母，后四位是數字。

 

注意：

上面三種校驗，中心思想都是通過對表單中輸入的內容進行某種校驗，最后提示信息。

 

關於正則表達式進行自定義的校驗，還有好幾種規則，在我下篇博客中詳寫。https://www.cnblogs.com/5201314m/p/11354268.html