今天碰到一个问题   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. [Xcode 实际操作]七、文件与数据-(14)数据持久化存储框架CoreData的使用：删除CoreData中的数据

    目录:[Swift]Xcode实际操作 本文将演示如何删除数据持久化对象. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit //引入数据持 ...

  2. 洛谷 P3931 SAC E#1 - 一道难题 Tree

    题目背景 冴月麟和魏潇承是好朋友. 题目描述 冴月麟为了守护幻想乡,而制造了幻想乡的倒影,将真实的幻想乡封印了.任何人都无法进入真实的幻想乡了,但是她给前来救她的魏潇承留了一个线索. 她设置了一棵树( ...

  3. urlencode()和urldecode()

    urlencode()函数原理就是首先把中文字符转换为十六进制,然后在每个字符前面加一个标识符%.一般用在url链接地址编码urldecode()函数与urlencode()函数原理相反,用于解码已编 ...

  4. git clone 指定新建本地库位置

  5. Leetcode:单调数列

    题目 如果数组是单调递增或单调递减的,那么它是单调的. 如果对于所有 i <= j,A[i] <= A[j],那么数组 A 是单调递增的. 如果对于所有 i <= j,A[i]> ...

  6. python isinstance函数 判断元素是否是字符串、int型、float型

    isinstance(1, int) 判断是否是int型isinstance(1.0, float) 判断是否是float型isinstance(s, str) 判断是否是字符串型isinstance ...

  7. Selenium~自动化测试来了

    这段时候研究了一下Selenium,它是一个自动化测试工具,在asp.net平台可以通过nuget去安装,同时支持多种开发语言,之前支持java,而现在也支持C#了,所以我们通过nuget就可以安装了 ...

  8. GC是如何回收SoftReference对象的

    看Fresco的代码中,有这样的一个类: /** * To eliminate the possibility of some of our objects causing an OutOfMemor ...

  9. pixhawk在linux（ubuntu16.04）下的开发环境搭建和源码编译

      1查找安装文档(http://dev.px4.io/starting-installing-linux.html)(本文仅针对硬件为PIXHAWK的开发环境搭建,其他硬件请参考官方文档)     ...

  10. 一、单例模式(Singleton)

    单例模式最初的定义出现于<设计模式>(艾迪生维斯理, 1994):“保证一个类仅有一个实例,并提供一个访问它的全局访问点.” 特点:一是某个类只能有一个实例: 二是它必须自行创建这个实例: ...