4.通过router传递接收id发送请求

1.传id

//1.在子组件中定义一个事件，传id
<template>
  <div @click="handleClick(data.id)">
    <img :src="data.coverImgUrl" />
    <p>{{data.name | format()}}</p>
  </div>
</template>
//2.在methods方法中触发
methods:{
    handleClick(id){
        console.log(id)
        this.$router.push(`/detail?id=${id}`)
    }
}

2.接收id并发送请求

父组件中接收
//Detail/index.vue
 export default {
        name:"Detail",
        computed:{
            id(){
                return this.$route.query.id     //接收上个页面传递的id
            }
        },
        methods:{
            toggle(){
                this.$router.back()     //再回到上一个页面
            }
        },
        mounted(){
            var id=this.id;     //获取id
            this.axios.get(`/top/playlist/detail?id=${id}`).then(res=>{    
                console.log(res)
            })
        }
    }