Vue中this.$route.query和this.$route.params的使用

一、this.$route.query的使用

1、router/index.js

{
 path:'/mtindex',
 component: mtindex,
 //添加路由
 children:[
   {
    path:':shopid',
    component:guessdetail
   }
 ]     

},

2、传参

this.$router.push({
        path: '/mtindex/detail', query:{shopid: item.id}

        });

3、获取参数

this.$route.query.shopid

4、url的表现形式(url中带有参数)

http://localhost:8080/#/mtindex/detail?shopid=1

二、this.$route.params的使用

1、router/index.js

	{
     path:'/mtindex',
     component: mtindex,
     //添加路由
     children:[
       {
        path:"/detail",
        name:'detail',
        component:guessdetail
       }
     ]     
    },

2、传参数（ params相对应的是name query相对应的是path）

this.$router.push({
        name: 'detail', params:{shopid: item.id}
        });

3、获取参数

this.$route.params.shopid

4、url的表现形式(url中没带参数)

http://localhost:8080/#/mtindex