欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

vue中路由传参的三种方式

程序员文章站 2022-05-18 15:30:33
...

 第一种, 第三种方法 页面刷新数据不会丢失; 第二种方法 页面刷新数据会丢失;

方式 跳转方式 对应路由 获取参数方式
第一种
//直接调用$router.push 实现携带参数的跳转
        this.$router.push({
          path: `/particulars/${id}`,
        })
{
  path: '/particulars/:id',
  name: 'particulars',
  component: particulars
}
this.$route.params.id
第二种
this.$router.push({
          name: 'particulars',
          params: {
            id: id
          }
        })
{
     path: '/particulars',
     name: 'particulars',
     component: particulars
   }
this.$route.params.id
第三种
this.$router.push({
          path: '/particulars',
          query: {
            id: id
          }
        })
{
     path: '/particulars',
     name: 'particulars',
     component: particulars
   }
this.$route.query.id

组件中 获取参数的时候是    route.params   这很重要~~~

 

相关标签: vue-router