今天碰到一个问题   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. python2与python3 版本区别

    目录 编码 输入输出 中文 除法 长整形 内置函数map xrange init reduce 字符串类型 dict字典 经典类 新式类 未完待补充 编码 python2默认编码器为ascii码(只支 ...

  2. Robot Frame应用实例讲解

    关键字与变量 内置库(build in)关键字 要使用的其它库关键字(学会看文档)

  3. js原型和构造函数

    前言 从应用层面深入理解原型模式和js中的构造函数. 构造函数(constructor) js中的任何对象都有自己的构造函数.js中使用字面量声明的普通对象({})或数组([])等子对象本质上都是使用 ...

  4. jvm 默认字符集

    最近在读取第三方上传的文件时,遇到一个问题,就是采用默认字符集读取,发现个别中文乱码,找到乱码的字,发现是生僻字:碶. 由于在window是环境下做的测试,并没有报错,但是在linux服务器上执行,发 ...

  5. null is not an object (evaluating 'Picker._init')

    安装完react-native-picker后,init出现报错,其实是原生配置还没完全生效,重启项目就可以了

  6. css布局全总结

    一  居 中 布 局 水平居中 1. 使用inline-block+text-align(1)原理.用法 原理:先将子框由块级元素改变为行内块元素,再通过设置行内块元素居中以达到水平居中. 用法:对子 ...

  7. .NET 基础 一步步 一幕幕[XML基础操作]

    XML可扩展标记语言,标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言. 什么是XML,学他有什么用? 优点:容易读懂,格式标准任何语言都内置了XML分析引擎,不用单独进行文件分 ...

  8. NET Core 防止跨站请求

    ASP.NET Core 防止跨站请求伪造(XSRF/CSRF)攻击 什么是反伪造攻击? 跨站点请求伪造(也称为XSRF或CSRF,发音为see-surf)是对Web托管应用程序的攻击,因为恶意网站可 ...

  9. (转)sudo配置文件/etc/sudoers详解及实战用法

    sudo配置文件/etc/sudoers详解及实战用法 原文:http://blog.csdn.net/field_yang/article/details/51547804 一.sudo执行命令的流 ...

  10. BI的意义

    BI系统建设的价值,有可能不值钱,也有可能价值数千万,就看我们大家好用了没.”所以,BI系统建设的收获,终究还是因企业而异的,再归根,便是与企业的文化,与企业的人,尤其是管理层是极为相关的了. 商业智 ...