如何通过id路由到另一个页面上

$router : 是路由操作对象，只写对象
$route : 路由信息对象，只读对象
通过query方法传参：
query传参地址使用path（路由地址）和name（路由名称）

  // 通过query传参需要写path和query，上次没有传过去值是因为前面没有加path，直接写了路径
   this.$router.push({ path: '/goods/edit', query: { id } })

在路由过去的页面接收

 //接收来自List.vue传来的id值
 //注意这里是route,而不是router！！！！
  const id = this.$route.query.id

通过params方法传参：

 this.$router.push({ name: 'Edit', params: { id } })

在路由配置页面中需要给这个路由配置那么属性
{
　　path: '/goods/edit',
　　name: 'Edit',
　　component: Edit
}

接收

const id = this.$route.params.id

通过query传参和params传参的区别：
（1）使用query传参，类似于get请求，使用params传参，类似于post请求。
（2）无论路由跳转方式是声明式导航，还是编程式导航，都有这两种传参方式。
（3）当然这两种传参方式可以同时使用，尚品汇第8集举了这个例子，在尚品汇31集合并参数时，同时使用了两种传参方式，原本以为=两种传参方式都用的情况没什么意义。
（4）params传参，push里面只能是 name:‘xxxx’，不能是path:’/xxx’，因为params只能用name来引入路由，如果这里写成了path，接收参数页面会是undefined。
重要总结：query的语法用于path编写的传参地址，也可用于name编写的传参地址，params的语法必须用于name编写的传参地址
（5）下面忘了说两种传参方式的接收传参的区别
这和是声明式导航还是编程式导航无关！
1）query：this.$route.query.key（key是参数名）
2）params：this.$route.params.key

以上引入：https://blog.csdn.net/HSH541/article/details/123611363
（6）query会在地址栏中显示参数，但是params不会在地址栏中显示，params是路由的一部分，必须要有；query是拼接在url后面的参数，没有也没关系。
（7）params一旦设置在路由，params就是路由的一部分，如果这个路由有params传参，但是在跳转的时候没有传这个参数，会导致跳转失败或者页面会没有内容。params、query不设置也可以传参，params不设置的时候，刷新页面或者返回参数会丢失，如果路由上面不写参数，也是可以传过去的，但不会在url上面显示出你的参数，并且当你跳到别的页面或者刷新页面的时候参数会丢失（如下图所示），那依赖这个参数的http请求或者其他操作就会失败。