umi页面跳转定位问题

2023-11-15

突然发现,在umi页面中,如果没有设置页面定位,那么在页面中部或者底部点击跳转到下一页,会默认跳转到该页面对应的中部或者下部的位置。那么,如果想要在跳转时,直接定位到页面的头部,应该怎么做呢?

首先,确定需求:目前项目的需求是:无论从上一页的哪个地方点击,都必须跳转到下一页内容的头部位置。这样一来,我们思路就有了:

页面跳转,无比伴随着页面pathname的修改。所以,我们只需要监听pahtname,只要pathname有变动,直接将页面内容定位在头部即可。只是,监听的事件要写在需要该需求的页面,或者该需求的页面能够访问到的页面。也就是,祖父页面。或者是具备该需求的父页面。

这其中,需要引用的依赖为:

import { history} from "umi";

然后在页面中:

  useEffect(() => {

    window.scrollTo(0, 0);

  }, [history.location.pathname])

以上,就大功告成啦!快去试试,好不好用吧~~

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

umi页面跳转定位问题 的相关文章

  • 数据治理体系解决方案(附PPT下载)

    下载方式 迎加入星球下载所有资料 转发朋友圈截图回复666亦可下载 加入星球好资料一直有 推荐阅读 世界的真实格局分析 地球人类社会底层运行原理 不是你需要中台 而是一名合格的架构师 附各大厂中台建设PPT 亿级 无限级 并发 没那么难 论
  • java基于微信小程序的四六级英语学习测试系统 uinapp 计算机毕业设计

    通过本课题的研究与分析 能够建立一种基于微信小程序的四六级助手系统 以MySQL为数据库 后端采用Java语言SSM框架 并对系统中的各个模块功能及它们之间相互协调工作进行了详细的分析与设计 尤其是对实现方法和过程进行了细致的设计与实现 最
  • Python动态的拼接变量名

    1 可以通过python的内置函数locals 来完成 locals是python的内置函数 他可以以字典的方式去访问局部和全局变量 python里面用名字空间记录着变量 就像javascript的window一样 他记录着各种全局变量 每
  • R语言数据可视化之初级绘图(上)

    1 条形图barplot 条形图通过垂直的或者水平的条形展示了类别型变量的频数分布 barplot 可实现条形图的绘制 其调用格式为 barplot x xlab yalb horiz F barplot x xlab ylab besid

随机推荐

  • 3.when表达式

    val week 0 Java的 if 语句 KT的 if 是表达式 有返回值的 val info when week 1 gt 今天是星期一 非常忙碌的一天开会 2 gt 今天是星期二 非常辛苦的写需求 3 gt 今天是星期三 努力写Bu
  • GirdLayout布局实现九宫格

    利用GirdLayout布局显示3 3布局的9张图片 每张图片宽度为屏幕的1 3
  • oracle 列相同编号,Oracle查询结果中:一列中相同的值或一列中重复的值,只显示一次...

    http www itpub net thread 1768915 1 1 html 问题 CREATE TABLE test ob id VARCHAR 32 ob name VARCHAR 32 INSERT INTO test VAL
  • Ioc容器refresh总结(2)--- Spring源码从入门到精通(三十二)

    上篇文章介绍了refresh里beanFactory的创建预准备工作 refresh获取到的beanFactory是先刷新创建 在getBeanFactory获取到的 之后再给他配置忽略自动装配的依赖接口 和配置自动装配的组件 Ioc容器r
  • IAR修改字体大小,source insight中文乱码

  • Gradle学习笔记 使用插件

    前面说了不少内容 但是我看了一下Gradle官方文档内容太多太详细 其中大部分内容其实我们不需要知道 一般情况下我们应用一部分插件就可以了 自己编写Gradle任务的情况并不多见 Java插件 在build gradle文件中添加以下一句
  • 搭建GitHub授权登录

    功能 搭建 功能 实现GitHub授权 获取用户在GitHub的有关信息 搭建 注册app 在GitHub的setting gt Developer Settings 开发者设置 中 点击New OAuth App 新建OAuth应用 根据
  • WebService 四种发布方式总结

    1 CXF方式 CXF与spring搭建webservice是目前最流行的方式 但是传闻cxf与jdk1 5有些不兼容 我没有遇到过 我遇到的问题是cxf与was6 1 1不兼容 表现在cxf必须的jar包 wsdl4j 1 6 2 jar
  • C++11 constexpr简单用法

    关键字 constexpr 是C 11中引入的关键字 声明为constexpr类型的变量 编译器会验证该变量的值是否是一个常量表达式 声明为constexpr的变量一定是一个常量 而且必须用常量表达式初始化 constexpr int mf
  • 如何使用GPT-4:一步步指南

    人工智能技术的发展 让自然语言处理成为了一个备受关注的领域 其中 GPT 4是当今最先进的自然语言处理模型之一 本文将详细介绍如何使用GPT 4进行自然语言生成 第一步 了解GPT 4 GPT 4是由OpenAI开发的自然语言处理模型 它采
  • Linux笔记--Shell编程入门

    查看当前环境下使用的shell 可以使用 echo SHELL 运行shell shell脚本是纯文本文件 通常以 sh作为后缀名 方便系统识别文件类型 但不是必需的 脚本文件中的第一行要指明系统使用哪种shell解释该shell文件 如
  • 计算机不显示桌面文件夹,电脑保存文件路径不显示桌面怎么办

    摘要 腾兴网为您分享 电脑保存文件路径不显示桌面怎么办 掌上电力 信达期货 小米手环 天翼购等软件知识 以及晒课网 国寿e门店 鼠标同步器 奇人怪事之谜 江西农村信用社 e视网 三星3200打印机驱动 超级人脉 晒黑的图片 烟花flash
  • kettle案例11-排序记录

    参考 ETL数据整合与处理 任务3 1 排序是对数据中心的无序记录 按照自然或客观规律 根据关键字段大小递增或递减的次序 对记录重新排列的过程 为了得出学生的成绩排名 需要对 2019年11月月考数学成绩 xls 文件 使用 排序记录 组件
  • JavaWeb图表插件的小研究

    背景 最近的一个项目中 对数据的统计分析有很大的要求 这就要求有一款很强大的报表 图表插件 因此 组长给分了任务 让我们各自去研究不同的图表插件 用了一两天的时间 对java这块的图表插件做了一个简单的研究 java方向的图报表还是有很多很
  • 小熊派BearPi-HM nano开发板 -- 前期准备

    课前准备 1 小熊派BearPi HM nano开发板 2 E53农业案例拓展版 3 学习资料 Ubuntu20 04版本 学习视频 学习课件 案例等等 安装教程 Ubuntu20 04安装及配置 开发环境Windows和Ubuntu的配置
  • STM32CubeMX ADC采样的坑

    1 选用了ADC1 IN15 ADC1 IN16 ADC1 IN17 ADC1 IN18会发现有的通道不能用 解决方法 把Sequencer设置为not fully configurable 这样子的弊端是无法再设置采样的先后优先级 但是
  • NBIOT模块连接巴法云实践(SIM7020)

    使用NBIOTSIM7020模块连接巴法云并进行数据通信 一 前期准备 1 巴法云新建主题 这里使用TCP协议 因此创建TCP设备云 2 模块 使用前焊接好模块天线 3 SIM卡 物联专用卡 4 USB UART接口 5 杜邦线4根 6 串
  • Ubuntu软件源、pip源大全,国内网站网址,阿里云、网易163、搜狐、华为、清华、北大、中科大、上交、山大、吉大、哈工大、兰大、北理、浙大

    文章目录 一 企业镜像源 1 阿里云 2 网易163 3 搜狐镜像 4 华为 二 高校镜像源 1 清华源 2 北京大学 3 中国科学技术大学源 USTC 4 上海交通大学 5 山东大学 6 吉林大学开源镜像站 7 哈尔滨工业大学开源镜像站
  • 像素鸟 代码 html,2021-04-05像素鸟代码

    html gt Document margin 0 padding 0 game width 800px height 600px background url images sky png position relative overfl
  • umi页面跳转定位问题

    突然发现 在umi页面中 如果没有设置页面定位 那么在页面中部或者底部点击跳转到下一页 会默认跳转到该页面对应的中部或者下部的位置 那么 如果想要在跳转时 直接定位到页面的头部 应该怎么做呢 首先 确定需求 目前项目的需求是 无论从上一页的