1.设置输入框内仅能输入文本onlyFile、数字OnlyNumber
<template>
<div class="">
<el-form :ref="subfrom" :model="tableData" label-width="" :rules="rules" size="mini">
<el-form-item label="标题" prop="title">
<el-input v-model="tableData.title"></el-input>
</el-form-item>
<el-form-item label="作者" prop="author">
<el-select v-model="tableData.author" style="width: 100%;">
</el-select>
</el-form-item>
<el-form-item label="电话" prop="tel">
<el-select v-model="tableData.tel">
</el-select>
</el-form-item>
<el-form-item label="地址" prop="address">
<el-select v-model="tableData.address">
</el-select>
</el-form-item>
<el-form-item label="邮箱 " prop="email">
<el-input v-model="its.fault_cause"></el-input>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data(){
return{
onlyFile:(rule,value,callback)=>{
if(value === ''){
callback(new Error('请输入标题!'));
}
else if((value != value.replace(/[\d]/g,''))){
callback(new Error('标题只能为文本内容!'));
}else{
callback();
}
},
onlyNumber:(rule,value,callback)=>{
if(value === ''){
callback(new Error('请输入联系方式'))
}else if((value != value.replace(/[^\d.]/g,''))){
callback(new Error('联系方式仅能为数字!'))
}else {
callback();
}
},
tableData:[
{
title:'',
author:'',
tel:'',
address:'',
email:''
}
],
rules:{
title:[{validator:"onlyFile", trigger: "blur"}],
author:[{required: true, message: "不能为空", trigger: "blur"}],
tel:[
{validator:"onlyNumber", trigger: "blur"},
{ "min": 11,"message": "至少填写11个字符", "trigger": "blur" }
],
address:[{required: true, message: "不能为空",trigger: "change", type: "number"}],
email:[{required: true, message: "不能为空",trigger: "change", type: "email"}]
}
}
methods:{}
},
mounted() {
this.rules.title = this.onlyFile();
this.rules.tel = this.onlyNumber();
}
}
</script>
<style scoped>
</style>