微客导航 » 文章资讯 » vue2.0 + ele的循环表单及验证字段方法

vue2.0 + ele的循环表单及验证字段方法

2023-09-08 02:43:05 152

关于vue2.0+ele的表单循环以及对应字段的验证！！！！！

html代码

提交取消

script代码

//引入接口
import{
fetchdata,
}from'src/api/login'

exportdefault{
varcheckTel=(rule,value,callback)=>{
//循环判断这里是关键，这样做才可以对循环里每一条做判断
for(leti=0;i{
for(leti=0;i{
varvdt=this.VDT.vdata(value,{'required':{msg:'请填写年龄'}});
if(!vdt.result){
callback(newError(vdt.msg));
}else{
callback();
}
};
return{
form:{
xh:[{
tel,
nickname,
isnickname:false,//附一个初始值，默认不显示。
}],
age:'',
id:'1',
},
rules:{
tel:[{required:true,validator:checkTel,trigger:'blur',}],
nickname:[{required:true,validator:checkNickname,trigger:'blur',}],
age:[{required:true,validator:checkAge,trigger:'blur',}],
},
},
},
created(){
this.getData();
},
methods:{
getData(){
this.fullScreenLoading=true;
fetchdata(this.id).then(response=>{//这里请求对应的接口
if(response.data.success==true){
this.fullScreenLoading=false;
this.form=response.data.data;//返回数据赋给表单

}else{
this.fullScreenLoading=false;
returnfalse;
}
}
}
}

本文只是作者在开发时总结出来的经验，希望可以有所帮助。

以上这篇vue2.0+ele的循环表单及验证字段方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

vue2.0 + ele的循环表单及验证字段方法

热门推荐

随机推荐