vue表單驗證電話號碼
阿新 • • 發佈:2021-12-31
<template>
<el-formref="form":rules="addRules":model="accountInfo"label-width="120px"style="width:500px">
<el-form-itemlabel="手機號碼"prop="phone">
<el-inputv-model="accountInfo.phone":disabled="isUpdate"/>
</el-form-item>
</el-form>
</template>
<script>
exportdefault{
data(){
varvalidatePhone=(rule,value,callback)=>{
if(value===''){
callback(newError('請輸入電話號碼'))
}
if(value.length!==11){
callback(newError('請輸入正確電話號碼'))
}
if(value.length!==11){
callback(newError('請輸入正確電話號碼'))
}
//驗證電話號碼手機號碼,包含至今所有號段??
varab=/^[1][3,4,5,7,8][0-9]{9}$/
if(ab.test(value)===false){
callback(newError('請輸入正確電話號碼'))
}
callback()
}
return{
addRules:{
phone:[
{required:true,message:'請輸入號碼',trigger:'blur'},
{validator:validatePhone,trigger:'blur'}
]
}
}
}
}
</script>
歡迎大家來瀏覽我的部落格,如發現我有寫錯的地方,歡迎交流指正。