Vueカスタムフォーム内容チェックrules
1596 ワード
Vueカスタムフォーム内容チェックrules
まず例を見てみましょう効果 エラー時の効果
正しい場合の効果
コンポーネント script中 遭遇した穴コンポーネント内【書き始めたときにpropが自定した名前】 rules中 ぶつかった穴 正しい携帯番号を入力すると、エラーとして表示され、valueが伝わってこないことに気づき、undefined 解決:propはデータのパラメータの名前と同じように書かれています.すなわちphone_number
まず例を見てみましょう
export default {
data() {
var validateMobilePhone = (rule, value, callback) => {
if (value === '') {
callback(new Error(' '));
} else {
if (value !== '') {
var reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error(' '));
} else {
callback();
}
}
}
};
return{
formPerson: {
phone_number: '',
},
rules: {
phone_number: [
{validator: validateMobilePhone, trigger: 'blur'}
]
},
}
}
}
rules: {
phone: [
{validator: validateMobilePhone, trigger: 'blur'}
]
}