我这里有两种方法都是可以用的

1,利用vue-router的默认模式hash,可以记录上一页的位置,如果需要点话,如果没有记录,在进入新页面的时候是返回到新页面的最顶部的

    scrollBehavior (to, from, savedPosition) {
console.log('这里是1:',to, from, savedPosition);
/*
* 如果有记录位置,进入新页面的时候滚动到记录的位置
* 如果没有记录位置,进入新页面的时候就在最顶部
*/
if(savedPosition) {
return savedPosition;
} else {
return { x: 0, y: 0 };
}
}

2,直接利用JavaScript的window的方法便可。

router.afterEach((to, from, next) => {
window.scrollTo(0,0);
})

vue-cli跳转到新页面的顶部的更多相关文章

  1. Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决

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

  2. PHP弹出提示框并跳转到新页面即重定向到新页面

    本文为大家介绍下使用PHP弹出提示框并跳转到新页面,也就是大家所认为的重定向,下面的示例大家可以参考下   这两天写一个demo,需要用到提示并跳转,主要页面要求不高,觉得没必要使用AJAX,JS等, ...

  3. react中实现点击跳转到新页面方法

    实现点击跳转到新页面,可以有两种形式,一个是本地页面打开,一个是本地页面不变跳转到新的页面. (一)页面点击本地页面打开新页面 引入ant的Button组件 <Button style={{ba ...

  4. 问题:使用ajax跳转到新页面无效(浏览器Safari)

    问题:使用ajax跳转到新页面无效(浏览器Safari)   window.open("{% url "runtestinfo" %}")   但是使用loca ...

  5. H5如何实现关闭当前页面,跳转到新页面?

    小程序有此功能的跳转方法. 那么H5如何实现该功能?  很简单. location.replace('new.html')  这个方法可以实现 关闭当前页面,跳转到新页面 的效果. 而   windo ...

  6. vue router 跳转到新的窗口方法

    在CreateSendView2.vue 组件中的方法定义点击事件,vue router 跳转新的窗口通过采用如下的方法可以实现传递参数跳转相应的页面goEditor: function (index ...

  7. Java web开发中页面跳转小技巧——跳转后新页面在新窗口打开

    最近学习Java web,在学习过程中想实现一个需求,就是在jsp页面跳转的时候,希望跳转后的新页面在新窗口中打开, 而不是覆盖原来的页面,这个需求使我困惑了好长时间,后来通过大海捞针似的在网上寻找方 ...

  8. vue 单页应用点击某个链接,跳转到新页面的方式

    <router-link class="goDetail" :to="{name: 'detail',params: {id:item.id}}" tar ...

  9. Android Studio实现页面跳转(新页面或者网站)

    一,跳转到另一个页面 百度了好久,好像好多种方法,从中挑选了一中比较方便的一中方法 利用Intent类进行实现 1,首先在firstActivity中添加相应的跳转命令代码 例如一下示例代码 if ( ...

随机推荐

  1. SQL - for xml path('') 实现多行合并到一行, 并带有分隔符

    docs.microsoft.com 链接:  SQL一个应用场景与FOR XML PATH应用 首先呢!我们在增加一张学生表,列分别为(stuID,sName,hobby),stuID代表学生编号, ...

  2. [Kubernetes]谈谈容器跨主机网络

    继上篇文章:[Kubernetes]浅谈容器网络,自己给自己挖的坑,这篇文章来谈谈容器跨主机网络. 要理解容器"跨主通信"的原理,就要来谈谈 Flannel 这个项目. Flann ...

  3. [Kubernetes]基于角色的权限控制之RBAC

    Kubernetes中有很多种内置的编排对象,此外还可以自定义API资源类型和控制器的编写方式.那么,我能不能自己写一个编排对象呢?答案是肯定的.而这,也正是Kubernetes项目最具吸引力的地方. ...

  4. 记一次简单的PHP代码审计(SSRF案例)

    题目链接: http://oj.momomoxiaoxi.com:9090/ 用dirsearch对网址进行扫描,发现robots.txt 命令行: python3 dirsearch.py -u & ...

  5. 配置ssh无密码登陆Linux

    Windows下面的话需要安装git,或者其他能执行shell命令的软件 1.首先要先修改SSH的配置文件 vi /etc/ssh/sshd_config#修改配置文件 #如果被#注释了,就取消#号, ...

  6. 使用Open Live Write发布CSDN博客

    ---安装open live write 1.序 在CSDN上发布博客相当麻烦,图片一张张的上传确实让人头大,虽然通过office也能发布博客,不过Open Live Write软件使用感觉更好. 2 ...

  7. Linux查看显示编辑文本文件

    1:cat -bash-4.1$ cat --help 用法:cat [选项]... [文件]... 将[文件]或标准输入组合输出到标准输出. -A, --show-all           等于- ...

  8. IntelliJ IDEA设置svn.exe的路径

    安装TortoiseSVN客户端时,必须选中command line client tools这个选项

  9. Python3学习笔记之十九

    1.    什么是orm? object  relation mapping  对象关系映射 一旦确定表关系为一对多:在多的表中添加关联字段. 一对一:可以在任意一张表添加关联字段. 多对多:创建第三 ...

  10. 当运行docker run -i -t ubuntu /bin/bash时,提示报错Error response from daemon: EOF?

    可能是下载过程中出现错误,重新执行docker pull ubuntu,在执行docker run -i -t ubuntu /bin/bash就OK了.