自己了解的一些小技巧
1. 如果想要根据跳转来隐藏自己所需要的组件的时候,可以通过路由元信息来进行决定。路由元
<!-- 利用路由元信息解决当前问题好处:一行代码就可以解决 -->
<Footer v-show="$route.meta.isShow" />
路由跳转
2. 路由跳转一共有三种方法
- 字符串的形式
router.push('/users/eduardo')
- 模板字符串的形式
router.push(
/user/${username})
- 对象的形式
router.push({ name: 'user', params: { username } })
如果params是空字符串的话,可以通过undefined来解决这个问题。4. params
不能与path
一起使用router.push({ path: '/user', params: { username } })
props的使用内容
1.当 props 设置为 true 时,route.params 将被设置为组件的 props。 跳转之后,直接将params中的数据放到跳转之后的组件的props中。
2.props也可以使用对象的形式
const routes = [
{
path: '/promotion/from-newsletter',
component: Promotion,
//在跳转到的props中可以直接得到newsletterPopup并且使用
props: { newsletterPopup: false }
}
]
3.函数形式
const routes = [
{
path: '/search',
component: SearchUser,
props: route => ({ query: route.query.q })
}
]