vue路由传参,使用props获取参数

在路由中定义props:
1、在path后添加 /:id ,则id参数存放在route.params中
2、articleTitle参数存放在route.query中

{
      path: '/article/:id',
      component: () => import( /* webpackChunkName: "article" */ "../pages/article"),
      props: (route) => ({
        id: route.params.itemId,
        articleTitle: route.query.draft
      })
}

跳转到article页面时:

this.$router.push({
       path: "/article/" + id,
       query: {
            articleTitle: "文章1"
       }
})

在article页面组件上接收参数:

props: {
   id: String,
   articleTitle: String
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容