日常开发记录-ElementUI+vue构建的当前页面可以滚动，必填项未填，想要自动跳转未填项表单，提升用户使用体验...

原创于 2022-06-02 15:33:00 发布 · 192 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #elementui #javascript #前端 #ecmascript

该博客提供了一个已验证的解决方案，用于在Vue.js应用程序中，当使用Element UI库时，自动将表单错误提示滚动到视口中央。通过获取错误元素并调用`scrollIntoView`方法，实现了错误提示的焦点定位。

解决方案：(已验证)

const errDom = this.$refs.myForm.$el.querySelectorAll('.el-form-item__error')[0] || { scrollIntoView: () => {} }
errDom.scrollIntoView({ block: 'center' })