vue path 参数的传递与获取

const User = {
  template: '<div>User {{ $route.params.id }}</div>'
}
const router = new VueRouter({
  routes: [
    { path: '/user/:id', component: User }
  ]
})

图片.png

       {
          path: '/jxSearch/:code',
          name: 'jxSearch',
          component: JxSearch,
          meta: {
            requireLogin: false,
            title: '鲸选搜索' + conf.fmTitle
          }
        },

图片.png
图片.png

传值

    goSearch (type) {
      if (type === 'k') {
        window.open('/jxsearch/k=' + this.searchVal)
      } else {
        window.open(`/jxSearch/${type}=${this.code}`)
      }
    },

接收值：

图片.png

  created () {
    let tcode = this.$route.params.code
    console.log(this.getQueryString(tcode))
    this.searchVal = this.getQueryString(tcode).k
    if (this.getQueryString(tcode).c) {
      this.isSearch = false
    }
  },
  beforeRouteUpdate (to, from, next) {
    let tcode = this.$route.params.code
    this.searchVal = this.getQueryString(tcode).k
    if (this.getQueryString(tcode).c) {
      this.isSearch = false
    }
    next()
  },

   // 获取url值
    getQueryString (query) {
      // 多个值
      if (query.indexOf('&') !== -1) {
        var code = query.split('&')
        var obj = {}
        for (let v of code) {
          let v2 = v.split('=')
          obj[v2[0]] = v2[1]
        }
        return obj
      } else {
        // 一个值
        const code = query.split('=')
        let obj = {}
        obj[code[0]] = code[1]
        return obj
      }
    },