vue 路由跳转传参

<li v-for="article in articles" @click="getDescribe(article.id)">


getDescribe(id) {
//   直接调用$router.push 实现携带参数的跳转
        this.$router.push({
          path: `/describe/${id}`,
        })

this.$route.params.id


父组件中:通过路由属性中的name来确定匹配的路由,通过params来传递参数。

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

this.$route.params.id


父组件:使用path来匹配路由,然后通过query来传递参数
这种情况下 query传递的参数会显示在url后面?id=?

this.$router.push({
          path: '/describe',
          query: {
            id: id
          }
        })


对应子组件: 这样来获取参数
this.$route.query.id
原文地址:https://www.cnblogs.com/whlBooK/p/10605743.html