今天碰到一个问题   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. React入门看这篇就够了

    摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...

  2. CC11:链表分割

    题目 编写代码,以给定值x为基准将链表分割成两部分,所有小于x的结点排在大于或等于x的结点之前 给定一个链表的头指针 ListNode* pHead,请返回重新排列后的链表的头指针.注意:分割以后保持 ...

  3. CC06:像素翻转

    题目 有一副由NxN矩阵表示的图像,这里每个像素用一个int表示,请编写一个算法,在不占用额外内存空间的情况下(即不使用缓存矩阵),将图像顺时针旋转90度. 给定一个NxN的矩阵,和矩阵的阶数N,请返 ...

  4. C-晾衣服

    链接:https://ac.nowcoder.com/acm/contest/892/C 题意: 鸡尾酒从杭州回来,囤积了许多衣服,洗好之后,他发现晾衣服是一件麻烦的事. 晾衣绳的长度只有L,而鸡尾酒 ...

  5. element-ui关于form表单在dialog中的重置

    form表单的重置是以第一次打开的数据作为重置标准,如果先打开的是更新,那么重置之后以第一次更新的数据作为标准; Dialog 中的内容是懒加载的,目前 edit (更新)方法的写法导致 Form 刚 ...

  6. Netty（5）@Sharable

    问题:我写了MyDecoder which extends ByteToMessageDecoder,单线程没问题,但是多线程时,报'the handler should be sharable'.查 ...

  7. Jenkins执行yarn install报错：error An unexpected error occurred:"... ... :Unexpected end of JSON input"

    解决方式: # cd /usr/local/n/versions/node/11.6.0/lib/(node的安装目录下) # rm -rf node_modules # yarn cache cle ...

  8. Even-odd Boxes hackerrank 分类讨论

    https://www.hackerrank.com/contests/101hack50/challenges/even-and-odd-boxes/editorial 昨晚做的时候卡了挺久的. 首 ...

  9. (转)Linux下java进程CPU占用率高-分析方法

    Linux下java进程CPU占用率高-分析方法 原文:http://itindex.net/detail/47420-linux-java-%E8%BF%9B%E7%A8%8B?utm_source ...

  10. js获取ISO8601规范时间

    var d = new Date(); d.setHours(d.getHours(), d.getMinutes() - d.getTimezoneOffset()); console.log(d. ...