页面切换后,滚动栏问题

news2024/11/24 11:00:00

项目场景:

提示: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;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/874948.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

与Docker同行:Tomcat安装指南

😊 作者: 一恍过去 💖 主页: https://blog.csdn.net/zhuocailing3390 🎊 社区: Java技术栈交流 🎉 主题: 与Docker同行:Tomcat安装指南 ⏱️ 创作时间: …

小龟带你妙写排序之插入排序

插入排序 一. 插入排序的原理二. 题目三. 思路分析(图加文字)四. 代码演示 一. 插入排序的原理 在前N个有序的元素,从N个元素之后全是无序的元素,将无序的元素插入到有序的元素中,形成一个有序的数组 二. 题目 给定一个有N个元素的数组&#…

Flowable初体验

创建一个普通Maven项目 目录结构 一、依赖、配置 pom.xml <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation"http://maven.apache.org/POM/4.0.0 http://maven.apac…

动力节点|深入浅出Vue框架学习教程,带你快速掌握前端开发核心技能

Vue是一款流行的JavaScript前端框架&#xff0c;最初由华人开发者尤雨溪创建&#xff0c;并在GitHub上开源发布&#xff0c;它采用MVVM模型的设计思维&#xff0c;专注于UI项目的开发&#xff0c;能够方便地组织和管理页面上的各个组件&#xff0c;大大提高了前端开发的效率。 …

基于Java+SpringBoot+vue前后端分离卓越导师双选系统设计实现

博主介绍&#xff1a;✌全网粉丝30W,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专…

通讯协议039——全网独有的OPC HDA知识一之聚合(七)实际时间最大值

本文简单介绍OPC HDA规范的基本概念&#xff0c;更多通信资源请登录网信智汇(wangxinzhihui.com)。 本节旨在详细说明HDA聚合的要求和性能。其目的是使HDA聚合标准化&#xff0c;以便HDA客户端能够可靠地预测聚合计算的结果并理解其含义。如果用户需要聚合中的自定义功能&…

Win10使用Guest和空密码访问共享的完整步骤

目录 前言 启动Guest 给予Guest网络权限 允许空密码登陆 启用不安全的来并登陆 总结 前言 我们经常需要使用空密码和guest账户访问Windows共享&#xff0c;因为某些设备不支持输入密码等&#xff0c;那么该如何设置呢&#xff0c;因为步骤比较固定而且繁琐&#xff0c;于…

IDEA常用设置与maven项目部署

目录 前言 一、Idea是什么 二、Idea的优点 三、Idea的常用设置 主题设置 设置鼠标悬浮提示 忽略大小写提示 自动导包 取消单行显示Tabs 设置字体 配置类文档注释信息模版 设置文件编码 设置自动编译 水平或者垂直显示代码 快捷方式改成eclipse 设置默认浏览器…

世微 AP5160 DC-DC降压恒流IC 大功率LED电源手电筒车灯驱动芯片 SOT23-6

产品描述 AP5160 是一款效率高&#xff0c;稳定可靠的 LED 灯恒流驱动芯片&#xff0c;内置高精度比较器&#xff0c;固定关断时 间控制电路&#xff0c;恒流驱动电路等&#xff0c;特别适合大功率 LED 恒流驱动。 AP5160 采用SOT23-6 封装&#xff0c;通过调节外置电流检测电…

电脑运行慢怎么办?四招教你优化速度

电脑运行慢怎么办&#xff1f;电脑运行缓慢是很多人常遇到的问题&#xff0c;而其中一个主要原因是电脑内堆积了过多的垃圾文件。因此&#xff0c;定期清理电脑垃圾是保持电脑流畅运行的重要步骤。 本文将介绍四种有效的方法&#xff0c;帮助你清理电脑垃圾&#xff0c;让电脑…

如何从cpu改为gpu,pytorch,cuda

1.cmd输入nvcc -V 2.得到 cuda版本后&#xff0c;去pytorch官网 3.根据自己的cuda进行选择 4.复制上述链接&#xff0c;进入cmd 5.cmd中输入activate XXX,这里的"XXX"指代自己在工程中用到的环境 6.进入后&#xff0c;将刚才链接粘贴&#xff0c;回车等待下载结束 …

java 解析p12证书 (获取公钥、私钥、序列号)

1. p12文件放在resources目录下 2. P12InfoVo import lombok.Builder; import lombok.Data;import java.io.Serializable; import java.security.PrivateKey; import java.security.PublicKey;/*** p12证书VO*/ Data Builder public class P12InfoVo implements Serializable{/…

最强自动化测试框架Playwright(17)- 模拟接口

模拟接口 介绍 Web API 通常作为 HTTP 终结点实现。Playwright提供了API来模拟和修改网络流量&#xff0c;包括HTTP和HTTPS。页面所做的任何请求&#xff0c;包括 XHR 和获取请求&#xff0c;都可以被跟踪、修改和模拟。使用Playwright&#xff0c;您还可以使用包含页面发出的…

生信豆芽菜-单基因与HRD评分的关系

网址&#xff1a;http://www.sxdyc.com/panCancerHRDScore 该工具主要用于查看单基因在泛癌中与HRD评分的相关性 提交后等待运行成功即可

Qt4/5升级到Qt6吐血经验总结V202308

00&#xff1a;直观总结 增加了很多轮子&#xff0c;同时原有模块拆分的也更细致&#xff0c;估计为了方便拓展个管理。把一些过度封装的东西移除了&#xff08;比如同样的功能有多个函数&#xff09;&#xff0c;保证了只有一个函数执行该功能。把一些Qt5中兼容Qt4的方法废弃…

IDEA项目实践——JavaWeb简介以及Servlet编程实战

系列文章目录 IDEA项目实践——创建Java项目以及创建Maven项目案例、使用数据库连接池创建项目简介 IDEWA项目实践——mybatis的一些基本原理以及案例 IDEA项目实践——动态SQL、关系映射、注解开发 IDEA项目实践——Spring框架简介,以及IOC注解 IDEA项目实践——Spring当…

利用ViewModel和LiveData进行数据管理

利用ViewModel和LiveData进行数据管理 1. 引言 在当今移动应用开发的世界中&#xff0c;数据管理是一个至关重要的方面。随着应用的复杂性不断增加&#xff0c;需要有效地管理和维护应用中的数据。无论是从服务器获取数据、本地数据库存储还是用户界面的状态&#xff0c;数据…

Python方式实现射后不管导弹的简易制导系统

1 问题 对QN-506上的S570智能反坦克制导导弹的射后不管产生了浓厚的兴趣&#xff0c;想用Python简易还原一下。 2 方法 之前查阅资料时了解到使用pygame库制作的贪吃蛇&#xff0c;是否有一种方法能让“贪吃蛇”一直跟着鼠标走呢&#xff1f;鼠标模拟行进中的坦克&#xff0c;“…

劝你入行嵌入式的五个理由

嵌入式技术作为一个备受瞩目的领域&#xff0c;已经吸引了越来越多的人才。如果您还在考虑是否要进入该领域&#xff0c;我建议您听听以下五个理由&#xff1a; 一、市场需求旺盛 随着科技的迅猛发展&#xff0c;嵌入式系统已经广泛渗透到我们生活的各个方面。从智能家居到智能…

rabbitmq的持久化

目录 队列实现持久化 如何删除队列​编辑 消息实现持久化 不公平分发 如何保障当 RabbitMQ 服务停掉以后消息生产者发送过来的消息不丢失。默认情况下 RabbitMQ 退出或由于某种原因崩溃时&#xff0c;它忽视队列和消息&#xff0c;除非告知它不要这样做。确保消息不会丢失需…