您现在的位置是: 首页 > 前端开发 Vue 路由跳转后不在顶部
Vue 路由跳转后不在顶部
2020-09-03 【前端开发】 1728人已围观 3480次浏览
简介Vue 路由跳转后不在顶部
Vue 项目中,在很长的页面中,使用下面代码
this.$router.push('/post/1')
进行路由跳转时,就会出现滚动条还是在当前位置,跳转的目标页并没有在顶部的问题,这样会对于很多长页面来说,是很困扰的
比较简单的解决方法就就是在 Vue 项目的 main.js 中添加下面的代码
// 处理页面跳转后不在顶部问题
router.afterEach((to, from, next) => {
window.scrollTo(0, 0)
})
具体位置可以是在 new Vue({ 之前即可,放在文件最后可能会出现不生效的问题
保存之后,再点击跳转,就会默认跳转目标页顶部
很赞哦! (0)
点击排行
- Error in execution; nested exception is io.lettuce.core.RedisCommandExecutionException: ERR DISABLE You can't write or read against a disable instance
- Debian apt 使用国内镜像
- RocketMQ 出现 sendDefaultImpl call timeout 问题
- 类 BASE64Decoder 程序包 sun.misc 找不到符号
- SpringBoot @NotBlank 不生效问题
- 记一次 Mybatis-Plus 自动填充无效问题解决
- nuxt 项目完整部署方案
- SpringBoot 2.x 文件上传出现 The field file exceeds its maximum permitted size of 1048576 bytes
站长推荐
猜你喜欢
- Python自动生成和安装requirements.txt文件中的依赖
- Win10 安装适用于Linux的Windows子系统
- SqlServer字符串处理
- CentOS 安装 Docker
- SpringBoot 启动测试时出现提示 Test class should have exactly one public zero-argument constructor
- sentinel directive while not in sentinel mode 问题解决
- RocketMQ 出现 sendDefaultImpl call timeout 问题
- Linux no space left on device 出现设备上没有空间问题
- mac idea spring boot 启动慢
- nuxt 项目完整部署方案