elementuiplus设置scroll-to-error之后 提示被遮挡的解决方案

项目场景:

普通的头部固定,中间滑动的布局,中间内容有表单,提交校验不通过时滚动到第一个错误项


问题描述

elementuiplus的scroll-to-error设置之后是局部滚动 当头部内容层级高于中间表单的时候,错误会被遮挡。

复制代码
---

# 原因分析:
> 错误被遮挡的原因 ,scroll-to-error是局部滚动,头部内容层级高时,会被遮住

---

# 解决方案:

## **scrollIntoView**

通过找到错误节点并指定滚动到错误节点****
```javascript
nextTick(() => {
          let isError = document.getElementsByClassName('is-error')
          isError[0].scrollIntoView({
            // 滚动到指定节点
            // 值有start,center,end,nearest,当前显示在视图区域中间
            block: 'center',
            // 值有auto、instant,smooth,缓动动画(当前是慢速的)
            behavior: 'smooth',
          })
        })

总结:正确的思想指导正确的行动 分析问题背后的原因,再采取正确的方式解决

相关推荐
夏幻灵2 分钟前
从零理解 Redux:从 state、action、reducer 到 Redux Toolkit 与异步请求
前端
烈风逍遥9 分钟前
第四篇:AI 模块架构设计:多 Provider 切换、RAG 知识库与 Agent 编排
前端·后端·架构
用户808061814369326 分钟前
JavaScript 面向对象入门到精通
前端·javascript
一条溺水的鱼33 分钟前
一次讲透 JS 闭包 —— 概念、原理、应用和内存泄漏
javascript·面试
吠品35 分钟前
STM32最小系统板引脚梳理与配置实操
前端·javascript·vue.js
曹一二39 分钟前
前端性能优化场景题:图片懒加载 + 大数据渲染
前端
敲代码的瓦龙39 分钟前
Jetpack?DataBinding!!!
android·java·开发语言·mysql·android-studio
GISer_Jing44 分钟前
Come on,工作总结
前端·ai·前端框架
Hilaku1 小时前
Sass 和 Less 在 2026 年彻底多余了吗?
前端·javascript·程序员
右耳朵猫AI1 小时前
Node.js周刊2026W38 | 进程中断缺陷修复、Copilot 迁至 Rust、Node 新增 VFS
javascript·后端·node.js