vue中params和query的区别 和router 及route的区别

vue中params和query的区别 和router 及route的区别
答：在vue中使用query要搭配path路径，而params只能由命名路由name来引入
路由中的配置：
{
path: '/argu/:name/:id', //这种路由配置是params传递参数,且这个后面必须加参数，如果不加，刷新页面这些参数会消失
name:'argu',
component: () => import('@/views/argu.vue'),
},
使用params传递参数注意要在path路径后面添加参数，不然刷新页面数据会丢失。

1.传参方式不同：
this.$router.push({
name: 'argu', //params要name一起用，不然接收不到参数
params: {
id: 123，
name: 'zz'
}
})

this.$router.push({
path: 'argu', //query 可以和path和name一起使用
query: {
id: 123,
name："zz"
}
})

2. 接收参数不同：
   this.$route.params.name
   this.$route.query.name

   组件中也可以用props来进行接受参数，这种方式（推荐方法）
   {
   path: '/argu',
   name:'argu',
   component: () => import('@/views/argu.vue'),
   //设置props为ture，代表将path后面的参数作为值，传递到组件中，组件中通过props属性接受这个值
   props:true,
   },

router 和 route 的区别
答： router为路由操作对象（push、go、replace 方法切换路由）
route为路由信息对象 （可以获取name、path、query、params等相关信息）

参考文献： https://blog.csdn.net/weixin_42282727/article/details/107505014