专业编程基础技术教程

网站首页 > 基础教程 正文

umi页面跳转定位问题

ccvgpt 2024-08-04 12:14:08 基础教程 28 ℃

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

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

umi页面跳转定位问题

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

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

import { history} from "umi";

然后在页面中:

useEffect(() => {

window.scrollTo(0, 0);

}, [history.location.pathname])


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

最近发表
标签列表