博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue控制路由滚动行为
阅读量:5240 次
发布时间:2019-06-14

本文共 924 字,大约阅读时间需要 3 分钟。

跳转路由时,要求跳转到指定路由的某个地方,可以使用scrollBehavior方法控制。

用法:

scrollBehavior(to,from,savedPosition){   }

scrollBehavior方法可以返回x,y 坐标点,也可以返回指定的选择器

例子:

import Vue from 'vue'import Router from 'vue-router' import Home from '../../view/Home.vue' import Test from '../../view/Test.vue' import News from '../../view/News.vue'Vue.use(Router)export default new Router({  routes: [    {      name:"Home",      component:Home,      path:"/"    },    {      name:"Test",      component:Test,      path:"/test"    },    {      name:"News",      component:News,      path:"/news"    },    {            path:"*",      redirect:"/"    }  ],  mode:"history",  //跳转到指定路由的指定坐标  scrollBehavior(to,from,savedBehavior){     if(to.path==="/test"){        return {          x:0,          y:100        }     };     // 跳转到指定的选择器     if(to.path==="/news"){      return {        selector:".here"      }     }  }})

 

转载于:https://www.cnblogs.com/luguankun/p/10744058.html

你可能感兴趣的文章
自建数据源(RSO2)、及数据源增强
查看>>
2018icpc徐州OnlineA Hard to prepare
查看>>
使用命令创建数据库和表
查看>>
linux下Rtree的安装
查看>>
PHP魔术方法之__call与__callStatic方法
查看>>
【模板】对拍程序
查看>>
【转】redo与undo
查看>>
dedecms讲解-arc.listview.class.php分析,列表页展示
查看>>
安卓当中的线程和每秒刷一次
查看>>
wpf样式绑定 行为绑定 事件关联 路由事件实例
查看>>
TCL:表格(xls)中写入数据
查看>>
Oracle事务
查看>>
String类中的equals方法总结(转载)
查看>>
标识符
查看>>
一步步教你轻松学奇异值分解SVD降维算法
查看>>
objective-c overview(二)
查看>>
python查询mangodb
查看>>
内存地址对齐
查看>>
创新课程管理系统数据库设计心得
查看>>
Could not resolve view with name '***' in servlet with name 'dispatcher'
查看>>