页面切换后,滚动栏问题

2023-11-17

项目场景:

提示:react项目antd后台管理系统


问题描述

  后台管理系统从a页面进入b页面,a页面有数据(有滚动条,且scollTop大于0),进入b页面后,滚动条不是位于初始位置(scollTop不等于0),b页面不是位于页面顶部

a页面,出现滚动条点击日志进入b页面


 b页面,这时b页面上面的搜索栏被滚动条拖到页面上面去了,并非页面初始状态

   使用window.scrollTo(0,0)以及网上其他的办法都没有用

原因分析:

  没有找对元素,这里不是针对window也不是document.body,这里的滚动条是项目中的组件元素产生的,所以网络上的解决方案都不适用,这里只要找对元素就行了


解决方案:

在b页面组件中找到元素将其scrollTop设置为0就行

document.getElementsByTagName('main')[0].scrollTop = 0;

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

页面切换后,滚动栏问题 的相关文章

  • 服装商城小程序制作:打造便捷购物体验和提升销售额的利器

    随着移动互联网的发展 服装商城小程序成为各大服装品牌推广销售的重要工具 它不仅能够为用户提供便捷的购物体验 还能帮助服装商城实现更高效的销售和管理 下面给大家介绍下服装商城小程序的优点以及制作流程 让您了解并充分利用这一利器 优点 便捷购物
  • 云端部署code-server

    code server下载地址 GitHub coder code server VS Code in the browser 操作环境 本文配置环境为 aliyun ECS Debian 11 5 准备工作 Xftp 阿里云ECS云服务器
  • 算法--吃火锅

    题目 和朋友一起吃火锅 有m个菜品 你的手速是n 即吃完一道菜 要经过时间n才能再去夹菜 任一菜品下锅后 都需要经过对应时间才能熟 过时就不可口了 怎样可以吃到最多的可口的菜 输入 第1行 菜品数量m 手速n 第2 m行 每行两个数字 第一
  • 所有的USB C 设备都需要CC芯片吗

    所有的DFP 如电源适配器 所有的DRP 如电脑 手机 平板 移动电源 所有需要检测DFP电流输出能力的UFP 所有支持PD的设备 都需要CC逻辑检测与端口控制芯片 换句话说 只有因为功耗较低而不需要检测电流能力的UFP U盘 耳机 鼠标等
  • 第五届蓝桥杯校内选拔赛试题java组_2014年第五届蓝桥杯国赛试题(JavaA组)

    1 结果填空 满分15分 2 结果填空 满分45分 3 代码填空 满分30分 4 程序设计 满分30分 5 程序设计 满分80分 6 程序设计 满分100分 1 标题 海盗分金币 有5个海盗 相约进行一次帆船比赛 比赛中天气发生突变 他们被

随机推荐