.elementUI的表单提交没有layui的那么智能,能直接跳到验证未通过的字段位置,所以需要自己写。
// 表单验证,页面过长,验证未通过跳到指定位置
export const verifyJump = {
data(){
return{
}
},
created(){
},
methods:{
submit(formName){
this.$refs[formName].validate((valid,object) => {
if (valid) {}else{
this.verifyJumpFn(object)
}
})
},
verifyJumpFn(object){
for (let i in object) {
let dom = this.$refs[i];
if (Object.prototype.toString.call(dom) !== '[object Object]') {
//这里是针对遍历的情况(多个输入框),取值为数组
dom = dom[0]
break
}
dom.$el.scrollIntoView(false);
// 下面这种写法不兼容ie
// dom.$el.scrollIntoView({
// //滚动到指定节点
// block: 'end', //值有start,center,end,nearest,当前显示在视图区域中间
// behavior: 'smooth', //值有auto、instant,smooth,缓动动画(当前是慢速的)
// })
}
}
}
}
注意:
网友评论