[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跳轉的知識
},
```
