Vue 2.x – 路由的props配置/replace属性
7.路由的props配置
作用:让路由组件更方便的收到参数
{
name:'xiangqing',
path:'detail/:id',
component:Detail,
//第一种写法:props值为对象,该对象中所有的key-value的组合最终都会通过props传给Detail组件
// props:{a:900}
//第二种写法:props值为布尔值,布尔值为true,则把路由收到的所有params参数通过props传给Detail组件
// props:true
//第三种写法:props值为函数,该函数返回的对象中每一组key-value都会通过props传给Detail组件
props(route){
return {
id:route.query.id,
title:route.query.title
}
}
}
8.<router-link>
的replace属性
<router-link>
- 作用:控制路由跳转时操作浏览器历史记录的模式
- 浏览器的历史记录有两种写入方式:分别为
push
`和
`replace
`,
`push
`是追加历史记录,
`replace
`是替换当前记录。路由跳转时候默认为
`push
- 如何开启
replace
`模式:
`<router-link replace .......>News</router-link>
代码
https://github.com/icrons/Vue-Learn/tree/master/35_src_%E8%B7%AF%E7%94%B1props%E9%85%8D%E7%BD%AE
https://github.com/icrons/Vue-Learn/tree/master/36_src_router-link%E7%9A%84replace%E5%B1%9E%E6%80%A7
版权声明:
作者:Ne-21
链接:https://blog.gocos.cn/archives/143.html
来源:云淡风轻
文章版权归作者所有,未经允许请勿转载。
THE END
0
二维码
海报
Vue 2.x – 路由的props配置/replace属性
7.路由的props配置
作用:让路由组件更方便的收到参数
{
name:'xiangqing',
path:'detail/:id',
component:Detail,
……

共有 0 条评论