我只是尝试使用路由器参数的基本功能,而我正在为router.params定义未定义
我的模板
<div id="app><template id="image-capture">
<div class="row" >
<router-link :to="{ path: 'vc/'+item.id}" class="btn btn-primary"> ACCEPT</router-link>
</div>
</template></div>
现在我的网址看起来像http://localhost/cams-web/#/vc/3
const ic = {
template: '#image-capture' ,
}
const vc = {
template: '#video-capture' ,
mounted () {
this.init()
},
methods: {
init () {
console.log(router); //returns object
console.log(router.params); //undefined..
},
}
}
const routes = [
{ path: '/ic', component: ic},
{ path: '/vc/:id', component: vc}
]
const router = new VueRouter({
routes
})
new Vue({
router,
}).$mount('#app')
答案 0 :(得分:5)
要访问router params,您需要在代码中使用this.$route.params
。您的代码应如下所示:
const vc = {
template: '#video-capture' ,
mounted () {
this.init()
},
methods: {
init () {
console.log(this.$route); //should return object
console.log(this.$route.params); //should return object
console.log(this.$route.params.id); //should return id of URL param
},
}
}
以下是fiddle。