vue 浏览器滚动行为
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 浏览器滚动行为的更多相关文章
- vue浏览器滚动加载更多
created () { var that = this; window.addEventListener('scroll',this.scroll,true) console.log(this.$r ...
- (转)JS浮动窗口(随浏览器滚动而滚动)
原文:http://hi.baidu.com/aiyayaztt/item/4201c55a6b729dced2e10c79 JS浮动窗口(随浏览器滚动而滚动) 往往用于一些联系方式,互动平台模块,随 ...
- 制作不随浏览器滚动的DIV-带关闭按钮
制作不随浏览器滚动的DIV 效果见 http://bbs.csdn.net/topics/90292438 的滚动效果. $(function(){ //获取要定位元素距离浏览器顶部的距离 var ...
- vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改
vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...
- 一个事件一定时间内只允许点击执行一次 与 vue阻止滚动穿透
可能我的方法很笨,简单实现来的就是给两个状态,一个状态点击时就发生改变,另外一个给一个定时器延迟改变 篮圈部分,给了两种状态,一个isDisable,一个comeTime 点击事件以后comeTime ...
- Vue 无限滚动加载指令
也不存在什么加载咯, 就是一个判断滚动条是否到达浏览器底部了. 如果到了就触发事件,米到就不处理. 计算公式提简单的 底部等于(0) = 滚动条高度 - 滚动条顶部距离 - 可视高度. 反正结 ...
- vue插件——滚动监听 vue-scrollwatch
造轮子的目的: 做项目的时候需要一个滚动监听的功能,html结构已经都写好了,不想使用vue组件的方式来写,因为不想改造html结构,于是花了几个小时做了一个简单的,使用vue指令方式来做的,项目上够 ...
- 实例PK(Vue服务端渲染 VS Vue浏览器端渲染)
Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...
- Vue服务端渲染和Vue浏览器端渲染的性能对比
Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...
随机推荐
- Xmind 常用快捷键列表(官方推荐)
XMind中文版快捷键指南 XMind是一款非常实用的思维导图软件,能够帮助人们快速理清思路,打开新的局面.熟练地掌握快捷键的操作不光能够提供便捷,更能很大程度上的缩短制作时间,提高工作效率.本文总结 ...
- 【原创】cython and python for kenlm
未经允许不可转载 Kenlm相关知识 Kenlm下载地址 kenlm中文版本训练语言模型 如何使用kenlm训练出来的模型C++版本 关于Kenlm模块的使用及C++源码说明 加载Kenlm模块命令 ...
- 1、概率vs统计
- 3.3.7 跳表 SkipList
一.前言 concurrentHashMap与ConcurrentSkipListMap性能测试 在4线程1.6万数据的条件下,ConcurrentHashMap 存取速度是ConcurrentSki ...
- 编写高质量代码改善C#程序的157个建议——建议72:在线程同步中使用信号量
建议72:在线程同步中使用信号量 所谓线程同步,就是多个线程在某个对象上执行等待(也可理解为锁定该对象),直到该对象被解除锁定.C#中对象的类型分为引用类型和值类型.CLR在这两种类型上的等待是不一样 ...
- struts整合dropzone.js上传图片遇到的点问题
问:struts后台无法获取文件对象和文件名称? 答:1. 到dropzone.js搜索"return xhr.send(formData);" 2. 在它前面有个这么句代码: f ...
- ViewResolver 视图解析器
pringMVC 视图解析器 前言 在前一篇博客中讲了 SpringMVC 的Controller 控制器,在这篇博客中将接着介绍一下 SpringMVC 视图解析器.当我们对SpringMVC控制的 ...
- [LeetCode 题解]: First Missing Positive
Given an unsorted integer array, find the first missing positive integer. For example,Given [1,2,0] ...
- 在Centos 7 上面 安装MySQL 5.7 简录
In a web browser, visit mysql.com page: https://dev.mysql.com/downloads/repo/yum/ Locate the desired ...
- vmware获取主机、数据中心等对象ManagedObjectReference
在vmware的api中提供以下列表中的对象,称作ManagedObjectReference,包括虚拟机信息.主机.数据中心等等一些信息,我们可以通过vcenter的web api得到. 下面我们来 ...