HTML <router-link to="/" tag='a'>:to可以绑定属性进行更改,在path中name一个名字,:to{name:'path.name'}</router-link> <router-view></router-view> 点击某页面,展示某页面
methods
// 跳转到上一次浏览的页面
this.$router.go(-1)
// 指定跳转的地址
this.$router.replace('/home')
// 指定跳转路由的名字下
this.$router.replace({name:'menuLink'})
// 通过push进行跳转
this.$router.push({
name:'menu'
})
router.js
path{}
// 子路由
children:[
{path:''},
]
redirect: 默认显示路由
children: 子路由
router-view复用
hmtl
<router-view name='histroy'>
{path:'/',components:{
default:Home,
'history':History
}}
返回页面之前浏览位置
滚动行为,需要页面有足够高度,并且浏览器需要支持history.pushState
const,
mode:'history',
scrollBehavior(to, from, savedPosition){
// return {x:0, y=100}
// return {selector:'.xxx'}
// 判断是否有savePosition行为,返回之前页面的浏览高度
if (savePosition) {
return savePosition
}else {
return {x:0, y=0}
}
}