import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import {routes} from './routes'
Vue.use(VueRouter) const router =new VueRouter({
routes ,
mode:'history',
scrollBehavior(to,from,savedPosition){
//浏览器滚动行为
//return {selector:'.btn'};
//return {x:0,y:100};
if(savedPosition){
return savedPosition;
}else{
return {x:,y:}
}
}
})
//全局守卫
/*router.beforeEach((to,from,next)=>{
//alert("还没有登录,请先登录");
// next();
//判断store.gettes.isLogin ===false
if(to.path == '/login'||to.path == '/register'){
next();
}else{
alert("还没有登录,请先登录");
next('/login');
} })*/
//后置钩子
/*router.afterEach((to,from)=>{
alert("after each");
})*/
new Vue({
el: '#app',
router,
render: h => h(App)
})

浏览器滚动行为:第一种到制定的位置

第二张到制定的标签或者id位置

第三种,到上次浏览的位置

vue 浏览器滚动行为的更多相关文章

  1. vue浏览器滚动加载更多

    created () { var that = this; window.addEventListener('scroll',this.scroll,true) console.log(this.$r ...

  2. (转)JS浮动窗口(随浏览器滚动而滚动)

    原文:http://hi.baidu.com/aiyayaztt/item/4201c55a6b729dced2e10c79 JS浮动窗口(随浏览器滚动而滚动) 往往用于一些联系方式,互动平台模块,随 ...

  3. 制作不随浏览器滚动的DIV-带关闭按钮

    制作不随浏览器滚动的DIV 效果见 http://bbs.csdn.net/topics/90292438  的滚动效果. $(function(){ //获取要定位元素距离浏览器顶部的距离 var ...

  4. vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改

    vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...

  5. 一个事件一定时间内只允许点击执行一次 与 vue阻止滚动穿透

    可能我的方法很笨,简单实现来的就是给两个状态,一个状态点击时就发生改变,另外一个给一个定时器延迟改变 篮圈部分,给了两种状态,一个isDisable,一个comeTime 点击事件以后comeTime ...

  6. Vue 无限滚动加载指令

    也不存在什么加载咯, 就是一个判断滚动条是否到达浏览器底部了. 如果到了就触发事件,米到就不处理. 计算公式提简单的   底部等于(0) =  滚动条高度 - 滚动条顶部距离 - 可视高度.  反正结 ...

  7. vue插件——滚动监听 vue-scrollwatch

    造轮子的目的: 做项目的时候需要一个滚动监听的功能,html结构已经都写好了,不想使用vue组件的方式来写,因为不想改造html结构,于是花了几个小时做了一个简单的,使用vue指令方式来做的,项目上够 ...

  8. 实例PK(Vue服务端渲染 VS Vue浏览器端渲染)

    Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...

  9. Vue服务端渲染和Vue浏览器端渲染的性能对比

    Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...

随机推荐

  1. zookeeper会话超时 链接超时的排查

    1.会话概述 在ZooKeeper中,客户端和服务端建立连接后,会话随之建立,生成一个全局唯一的会话ID(Session ID).服务器和客户端之间维持的是一个长连接,在SESSION_TIMEOUT ...

  2. 白盒测试实践--Day2

    累计完成任务情况: 阶段内容 参与人 完成CheckStyle检查 小靳 完成代码评审会议纪要和结果报告 小熊.小梁及其他 完成白盒测试用例 小尹 学习静态代码审核,确定评审表,开评审会确定高危区代码 ...

  3. bootstrap小图标引用方法

    <span class="glyphicon glyphicon-search"></span> <span class="glyphico ...

  4. mysql 字符串操作

    -- 字符串的长度 SELECT LENGTH('abc'),LENGTH('我的家'); SELECT CHAR_LENGTH('abc'),CHAR_LENGTH('我的家'); -- 合并字符串 ...

  5. 【转】彻底理解ThreadLocal

    ThreadLocal是什么 早在JDK 1.2的版本中就提供Java.lang.ThreadLocal,ThreadLocal为解决多线程程序的并发问题提供了一种新的思路.使用这个工具类可以很简洁地 ...

  6. 42 :809*x=800*x+9*x+1

    题目:809*x=800*x+9*x+1(去掉最后的1有解)其中x代表的两位数,8*x的结果为两位数,9*x的结果为3位数.求x代表的两位数,及809*x后的结果(两种方法实现) public cla ...

  7. 编写高质量代码改善C#程序的157个建议——建议127:用形容词组给接口命名

    建议127:用形容词组给接口命名 接口规范的是“Can do”,也就是说,它规范的是类型可以具有哪些行为.所以,接口的命名应该是一个形容词,如: IDisposable表示可以被释放 IEnumera ...

  8. Alpha冲刺(十)

    Information:   队名:彳艮彳亍团队 组长博客:戳我进入 作业博客:班级博客本次作业的链接 Details: 组员1(组长)柯奇豪 过去两天完成了哪些任务 本人负责的模块(共享编辑)的前端 ...

  9. hadoop之MapReduce学习

    为什么需要MapReduce 进行分析数据,计算方便和复用性强:而且是文件级别的 进程包括三个 mrappmaster:负责整个程序管理 maptask:负责map阶段的整个过程 reducemask ...

  10. linux权限及目录

    [-][rwx][r-x][r--] r:4 - 读  w:2 - 写  x:1 - 执行 1:代表文件类型 2:代表文件所有者的权限 3:代表文件所在组的权限 4:代表其他用户的权限 chgrp:修 ...