Vue: vue-router路由传参方法

Vue: vue-router路由传参方法

这里不对 vue-router 的 传参方法 展开讨论，这里只阐述 最有效、最省力 的 传参 方法.

模板 (Template):

      this.$router.push({
          path: '/path',
          query: {
            paramName: paramValue
          }
      })

router.js 中的路由配置:

    {
        path: "/path",
        name: "pathName",
        component:  () =>
        import ("@/components/XXX")
    },

demo

传参页面js代码:

	  var _this = this;
      this.$router.push({
          path: '/ideaInfo',
          query: {
            ideaId: _this.ideaId,
          }
      })

接受参数页面路由配置:

接受参数页面js代码:

注: 此时获取 传参值，调用的是 this.$route.query.paramName ;

var ideaId = this.$route.query.ideaId;

References

1. https://www.jianshu.com/p/d276dcde6656