今天碰到一个问题   vue路由跳转到新的页面时会直接显示页面最底部  正常情况下是显示的最顶部的  而且好多路由中不是全部都是这种情况  折腾好长时间也没解决  最后在网上找到了解决办法

其实原理很简单  就是在页面加载完毕后  把滚动条的距离设置为（0，0） 就解决了

mounted ()

    this.$router.afterEach((to, from, next) => {

        window.scrollTo(0, 0)

    })

}

很不理解的就是为什么会出现这种情况呢？

Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决的更多相关文章

  1. vue 路由跳转前确认框，刷新浏览器页面前提示确认框

    先看效果图: 1.刷新页面效果: 2.跳转路由(进入别的页面前)效果: 代码: // 路由跳转确认 beforeRouteLeave(to, from, next) { const answer = ...

  2. vue路由跳转取消上个页面的请求和去掉重复请求

    vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求

  3. vue路由跳转的方式

    vue路由跳转有四种方式 1. router-link 2. this.$router.push() (函数里面调用) 3. this.$router.replace() (用法同push) 4. t ...

  4. 详解vue 路由跳转四种方式 (带参数)

    详解vue 路由跳转四种方式 (带参数):https://www.jb51.net/article/160401.htm 1.  router-link ? 1 2 3 4 5 6 7 8 9 10 ...

  5. vue路由跳转报错解决

    vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...

  6. 去除vue路由跳转地址栏后的哈希值#

    去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值# mode:"history" import ...

  7. 关闭open页面时刷新父页面列表

    var winObjEI = window.open("/Invoice/InvoiceViewEI?invoiceid=" + data.InvoiceId); ; //关闭op ...

  8. Vue路由跳转时显示空白页面，iview的使用

    最近在用iview做项目,需要实现登录,注册,忘记密码等功能.iview-admin本来就有登录功能,于是想照葫芦画瓢,实现登录界面的注册,忘记密码页面路由跳转. router.js里路由配置,刚开始 ...

  9. vue路由跳转时判断用户是否登录功能

    通过判断该用户是否登录过,如果没有登录则跳转到login登录路由,如果登录则正常跳转. 一丶首先在用户登录前后分别给出一个状态来标识此用户是否登录(建议用vuex): 简单用vuex表示一下,不会可以 ...

随机推荐

  1. 基于testcontainers的现代化集成测试进阶之路

    大型的软件工程项目除了大量的产品级代码外必不可少的还有大量的自动化测试.自动化测试包含从前端到后端甚至到产品线上不同模块和环境的各种类型的测试.一个比较经典的关于自动化测试分布的理论就是测试金字塔,是 ...

  2. 教程 | Linux常用命令大全

    Linux常用命令 目录操作命令 ls 命令名称:ls 命令英文原意:list 命令所在路径:/bin/ls 执行权限:所有用户 功能描述:显示目录文件 ls (显示当前目录下文件) ls 目录名 ( ...

  3. 基于SSM搭建网站实现增删改查

    网站源码地址:https://github.com/MyCreazy/BasicOperateWebSite.git 使用maven搭建网站的时候,记得选用war包格式,有时候maven包没有引用进来 ...

  4. java 同时安装多版本问题（转）

    描述:刚到新公司,自己安装了jdk1.7和开发工具myeclipse10,但是由于公司项目的需要(具体原因不详细描述了),需要使用myeclipse6.5和jdk1.6.于是在切换jdk1.7和jdk ...

  5. swift 广告轮播图

    import UIKit import Kingfisher class BannerView: UIView,UIScrollViewDelegate{ enum ImageType{ case I ...

  6. Jenkins+Gitlab+Ansible自动化部署(一)

    首先准备实验环境 虚拟机 主机名 IP地址 服务 系统版本 内核版本 Vmware Workstation 14 gitlab.example.com 192.168.244.130 gitlab  ...

  7. RDL 数值列排序

    [注意:RDL排序要删除组内的默认排序字段] 在SSRS中排序时,如果是数值列,默认为显示成以下,会按字母的顺序排序,但并不是我们想要的结果: 怎样达到我们要的效果,按数值排序: 1.进入页面,默认排 ...

  8. sql 容易被忽视的点

    1 dual select查询语句只有select就可以,但为了规范,凑结构,可以加个dual 例:select now() from dual; 这个概念是Oracle中的.在mysql中可写可不写 ...

  9. I/O流操做总结（三）

    说实话,其实我并不是很喜欢Java这门语言,尽管它很强大,有很多现成的API可以调用 但我总感觉它把简单的事情弄得太过复杂,甚至有时候会让人迷失 弄不清到底是为了写出东西,还是为了语言本身 我学习的第 ...

  10. 邮箱/邮件地址的正则表达式及分析(JavaScript，email，regex)

    简言 在做用户注册时,常会用到邮箱/邮件地址的正则表达式.本文列举了几种方案,大家可以根据自己的项目情况,选择最适合的方案. 方案1 (常用) 规则定义如下: 以大写字母[A-Z].小写字母[a-z] ...