[TOC]
## 2.1router.js配置,传那些参数
```
//只传递id
{
path: '/about/:id',
name: 'about',
component: ()=>import('@/pages/About.vue')
}
```
## 2.2例如从Home,跳转到Detail
```
//Home.vue
<button @click="handleClick">detail</button>
methods:{
handleClick(){
this.$router.push('/about/'+10);
}
}
```
## 2.3Detail.vue
```
//Detail.vue
export default {
name:"About",
mounted(){
console.log(this.$route.params)
}
}
```
## 2.4 子组件向父组件传参
```
<div class="child" @click="handleClick">
props: {
movie: {
type: Object
}
},
handleClick() {
//子组件向父组件传参
this.$emit("jump", this.movie.id);
//this.movie.id 要向父组件传的值
}
```
## 2.5 父组件接收值
```
<movie-item v-for="(item,index) of movies " :key="index" :movie="item" @jump="onjump"></movie-item>
```
> 使用 传过来的值id
```
//直接接收使用
onjump(id){
this.$router.push('/about/'+id);
//这是2.2跳转的知识
},
```