vue路由传参

前言

之前，查了其他博客，总结一篇,发现貌似不对？？，因此又查了一遍好不容易写了出来。

1.query传参

一种是，这样滴。

// 跳转
this.$router.query.push(name:'useredit',query:{id:scope.row.id});


<router-link :to="{name:'useredit',query:{id:scope.row.id}}" >编辑</router-link>

跳转之后，路由路径是这样滴，添加了参数。

http://localhost:8080/useredit?id=8

在router中的index.js对应的路由路径，可以不用修改，用原路径就可以。

 // 注册
    {
        path: "/register",
        name: "register",
        component: () => import("@/views/Login/RegiSter.vue")
    },

this.$routr.query.id 拿到值

2.parms传参

// 跳转
this.$router.push(path:path:'/useredit/'+scope.row.id);

<router-link :to="{path:'/useredit/'+scope.row.id}" >编辑</router-link>

跳转之后，页面路径变为

http://localhost:8080/useredit/8

在routet 的index.js文件需要更改路由路径。

   {
        path:"/useredit/:id",
        name:"useredit",
        component: () => import ("@/views/User/UserEdit.vue")
   },

this.$routr.params.id 拿到值

 总结

其实，按照RusultFull来看，params传参会好一点。

反正，我没觉得，那个会隐藏路径。