3-2异步路由 get传值

一、异步路由

export default new Router({
    mode:"hash",
    routes:[
        ...
        {
            path:"/detail",
            name:"detail",
            /* 异步路由 */
            component:()=>import('@/pages/Detail')
        }
    ]
})

二、get 传值

2-1 在列表页传值this.$router.push()

<div @click="handleClick(data.id)"></div>
export default {
    name:"Item",
    props:{
        data:{
            type:Object,
            required:true
        }
    },
    methods:{
        handleClick(id){
            console.log(id)
            this.$router.push(`/detail?id=${id}`)
        }
    }
};

2-2 在详情页接收值this.$route.query

export default {
    name:"Detail",
    computed:{
        id(){
            return this.$route.query.id
        }
    }
};

2-3在详情页接收id发送http请求

 mounted() {
    this.axios.get(`/candy/detail?id=${this.id}`).then(res => {
      this.sub = res.data;
    });
  }

2-3 在详情页跳转回列表页

this.$router.back()