页面切换后,滚动栏问题

项目场景:

提示: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.rhkb.cn/news/88892.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Opencv4基于C++基础入门笔记:图像 颜色 事件响应 图形 视频 直方图

效果图◕‿◕✌✌✌:opencv人脸识别效果图(请叫我真爱粉) 先看一下效果图勾起你的兴趣! 文章目录: 一:环境配置搭建 二:图像 1.图像读取与显示 main.cpp 运行结果 2.图像色彩空间转换 2.1 换色彩 test.h …

自动化安装系统—PXE(一)

系统安装过程 加载boot loader加载启动安装菜单加载内核和initrd文件加载根系统运行anaconda的安装向导 安装光盘中与安装相关的文件 安装autofs启动后会自动出现/misc目录。 在虚拟机设置中添加CD/DVD,使用系统ISO文件,登录系统后mount /dev/cdrom …

Kettle系列(二)smart-kettle本地离线部署

Kettle系列(二)smart-kettle本地离线部署 说明一、概述二、代码下载(1)后端代码依赖下载(2)前端代码依赖下载 三、创建数据库(mysql8)四、修改配置文件五、mysql8数据库配置六、其他…

网络:路由

1. 路由器 路由器工作在三层,每个接口都处于不用的网段中,即不同的广播域。但大多情况下,两台路由器直接相连的接口是同一个广播域,即一个网段。 路由器具有判断网络地址和选择路径的功能,能在多网络互联的环境中&…

Mybatis一级缓存与二级缓存

Mybatis一级缓存与二级缓存 缓存就是内存中的数据,常常来自对数据库查询结果的保存,使用缓存可以避免频繁与数据库进行交互,从而提高查询响应速度。 mybaits提供内存支持; 一级缓存 一级缓存,sqlSession级别的缓存…

NZ系列工具NZ02:VBA读取PDF使用说明

【分享成果,随喜正能量】时光绽放并蒂莲,更是一份殷殷嘱托,更是一份诚挚祝福,是一份时光馈赠,又是一份时光陪伴。。 我的教程一共九套及VBA汉英手册一部,分为初级、中级、高级三大部分。是对VBA的系统讲解…

多线程事务怎么回滚?

项目中用到了多线程去批量处理一些数据,当时想当然认为只要方法上加上Transactional注解就好了,实际并未达到想要的处理效果。特此去学习了下关于多线程事务回滚相关方案,参考了网上其他资料,这里整理并记录下学习历程。 站在巨人…

VR全景智慧文旅,用科技助力旅游业振兴

引言: 近年来,科技的迅猛发展将我们带入一个全新的数字化时代,而虚拟现实(Virtual Reality,简称VR)技术则以其令人惊叹的全新方式,影响着各个领域。其中,旅游业作为人们探索世界、体…

微服务03-RabbitMQ

1、简介 MQ,中文是消息中间件(队列)(MessageQueue),字面来看就是存放消息的队列。也就是事件驱动架构中的Broker。 简单来说,消息中间件就是指保存数据的一个容器(服务器),可以用于两个系统之间的数据传递。 几种常见MQ的对比: RabbitMQActiveMQRocketMQKafka公司…

云安全攻防(十)之 资源耗尽型攻击

资源耗尽型攻击 同为虚拟化技术,容器与虚拟机既存在相似之处,也有显著不同。在资源限制方面,无论使用 VMware、Virtual Box 还是 QEMU,我们都需要为即将创建的虚拟机设定明确的CPU、内存及硬盘资源阈值。在虚拟机内部进程看来&am…

Android自定义侧滑Item

源码地址&#xff1a;https://github.com/LanSeLianMa/CustomizeView/tree/master/cehuaitem 使用方式一&#xff1a;XML布局中直接使用 <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com…

【Node.js】低代码平台源码

一、低代码简介 低代码管理系统是一种通过可视化界面和简化的开发工具&#xff0c;使非专业开发人员能够快速构建和管理应用程序的系统。它提供了一套预先定义的组件和模块&#xff0c;使用户可以通过拖放操作来设计应用程序的界面和逻辑。低代码管理系统还提供了自动化的工作…

STM32自带的DSP库的滤波初体验(一)

最近在弄STM32自带的DSP库里的滤波&#xff0c;记录一下&#xff1a; arm_fir_instance_q15 instance_q15_S; #define NUM_TAPS 16 //滤波系数的个数 #define BLOCK_SIZE 32 q15_t firStateF32[BLOCK_SIZE NUM_TAPS]; q15_t Fir_Coeff[NUM_TAPS] {-79, -136, 312, 6…

基于 SIFT 和 RANSAC 算法对高分辨率图像进行图像伪造检测(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

二叉树的存储结构(顺序存储)—— 数据结构与算法

&#x1f636;‍&#x1f32b;️Take your time ! &#x1f636;‍&#x1f32b;️ &#x1f4a5;个人主页&#xff1a;&#x1f525;&#x1f525;&#x1f525;大魔王&#x1f525;&#x1f525;&#x1f525; &#x1f4a5;代码仓库&#xff1a;&#x1f525;&#x1f525;魔…

从零开始学习 Java:简单易懂的入门指南之抽象类接口内部类(十一)

面向对象进阶&#xff08;抽象类&接口&内部类&#xff09; 第一章 抽象类1.1 概述1.1.1 抽象类引入 1.2 abstract使用格式1.2.1 抽象方法1.2.2 抽象类1.2.3 抽象类的使用 1.3 抽象类的特征1.4 抽象类的细节1.5 抽象类存在的意义 第二章 接口2.1 概述2.2 定义格式2.3 接…

机器学习 | Python实现KNN(K近邻)模型实践

机器学习 | Python实现KNN(K近邻)模型实践 目录 机器学习 | Python实现KNN(K近邻)模型实践基本介绍模型原理源码设计学习小结参考资料基本介绍 一句话就可以概括出KNN(K最近邻算法)的算法原理:综合k个“邻居”的标签值作为新样本的预测值。更具体来讲KNN分类过程,给定一个训…

第二十一章 重要HL7操作场景 - HL7批量消息

文章目录 第二十一章 重要HL7操作场景 - HL7批量消息支持的批处理格式处理传入的批次文档批处理模式自定义出库批量处理 第二十一章 重要HL7操作场景 - HL7批量消息 Production品支持 HL7 中的嵌套子文档&#xff08;批处理格式&#xff09;。每个子文档本身就是一个虚拟文档。…

【设计模式】MVC 模式

MVC 模式代表 Model-View-Controller&#xff08;模型-视图-控制器&#xff09; 模式。这种模式用于应用程序的分层开发。 Model&#xff08;模型&#xff09; - 模型代表一个存取数据的对象或 JAVA POJO。它也可以带有逻辑&#xff0c;在数据变化时更新控制器。View&#xff…

Python爬虫——requests_cookie登陆古诗文网

寻找登陆需要的参数 __VIEWSTATE:aiMG0UXAfCzak10C7436ZC/RXoZbM2lDlX1iU/4wjjdUNsW8QUs6W2/3M6XIKagQZrC7ooD8Upj8uCnpQMXjDAp6fS/NM2nGhnKO0KOSXfT3jGHhJAOBouMI3QnlpJCQKPXfVDJPYwh169MGLFC6trY __VIEWSTATEGENERATOR: C93BE1AE from: http://so.gushiwen.cn/user/collect.…