A:router路由配置
export default new Router({ routes: [ { path: '/home', name: 'Home', component: Home, children:[ {path:'home1',component:Home1}, {path:'home2',component:Home2}, {path:'home3',component:Home3}, {path:'home4',component:Home4}, ], },{ path: '/detail', name: 'detail', component:Detail },{ path:'/',redirect:'/home/home1' } ], linkActiveClass:'ac' })
B.template内部
<li v-for="data in tuijiaList.playlists"> <router-link :to="{path:'/detail',query:{id:data.id}}" > <span>{{data.playCount}}</span><i><img :src="data.coverImgUrl"></i> <p>{{data.name}}</p> </router-link> </li>
C:在detail页面上怎么得到id 值?
this.$route.query.id;
在vue中怎么动态变换router-link中to的值
比如有这么个router需要跳转
const router = new VueRouter({ routes: [ { path: '/user/:userId', name: 'user', component: User } ] })
你的router-link可以这么写
<router-link :to="{ name: 'user', params: { userId: 123 }}">User </router-link>还可以用编程在代码里写，效果也一样：
router.push({ name: 'user', params: { userId: 123 }})
click 传值
productDet(inde) {
this.$router.push({
path: "/addsEdit",
name: "addsEdit",
params: {
indexs: inde
}
});
},
接收
this.indexs= this.$route.params.indexs;