vue-router获取不到params参数

Question

我想通过 vue-router 跳转一个新的页面，并传递参数到新页面中，但是怎么也获取不到 params 里的数据，下面是具体代码。

发起跳转页面js代码：

var router = new VueRouter({
  mode: 'history',
  routes: [{path: '/article/detail/', name: '/detail'}]
})
Vue.component('article-card',{
  template: '#article-card',	
  methods: {		
    _to: function(){			
      var detail = this.$router.resolve({name: "/detail", params: {article_id: 78}})	
      window.open(detail.href, '_blank')		
    }	
  },
})
var article_list = new Vue({
  el: '#article_list',
  router: router
})

/article/detail/ 会请求后端，返回一个新的页面，在新页面中获取 params 。

_to 就是发起请求的方法，在页面的组件中调用。

目标页面js代码：

var router = new VueRouter({				
  mode: "history"			
})
var header = new Vue({				
  el: '#header',
  created: function(){					
    console.log('id::'+this.$route.params.article_id)				
  },
  router: router,
})

可以跳转到目标页面，控制台也没有报错，但是打印结果为 undefined 。

使用 query 传参可以正常获得参数。

检查了很长时间没发现哪里出错，拜托大家帮忙看一下。

上面的代码都是直接在 js 文件里写的，没有用模块化。

Answer 1

你在mounted函数中试一下，name 把斜杠去掉。我感觉，你用window.open()，并没有使用router.push()特性。你打一下，query下 datail.href, 和 param 下的detail.hrefquery 应该是 /article/detail?article_id=78param 应该是 /article/detail我是新手，才刚开始学，看代码比较慢。