vue-router v0.7.13 如何获取params值?
本文介绍了vue-router v0.7.13 如何获取params值?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
Vue.js v1.0.28 / vue-router v0.7.13
路由切换已经实现。但我想用$route.params.* ,向同一个子组件传送不同的数据,可是无法实现,请教错在哪?
<body>
<div id="app"></div>
<!-- 父模板 -->
<template id="parent">
<div class="parent">
<router-view></router-view>
<nav>
<a v-link="{ path: '/child',params: { a: 1 } }">child-1</a>
<a v-link="{ path: '/child',params: { a: 2 } }">child-2</a>
<a v-link="{ path: '/other' }">other</a>
</nav>
</div>
</template>
<script>
child = Vue.extend({template: '<div class="round">子:{{$route.params.a}}</div>' });
other = Vue.extend({template: '<div class="round">other</div>'});
parent = Vue.extend({template: '#parent'})
Vue.use(VueRouter);
var router = new VueRouter();
router.map({
'/child': {component: child },
'/other': {component: other }
});
router.start(parent, '#app');
router.go({"path":"/child"} );
</script>
</body>
解决方案
已经找到了答案:
router.map({
'/child/:a/:b/:c': {name:'child',component: child },
'/other': {component: other }
});
router.start(parent, '#app');
var ppp = { a: 888,b: 12222,c: 666 };
router.go({name: 'child',params: ppp } );
这篇关于vue-router v0.7.13 如何获取params值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文