vue 已购课程页面调用数据

vue 已购课程页面调用数据的处理

代码如下

        const data = reactive({
            bind_phone : false,
            course : [],
            hot : [],
            course_open : false,
        })
        const router = useRouter();
        let token = window.localStorage.getItem('token');
        Purchased({token:token}).then( (e)=> {
               data.course = e.data.data.course;
               data.course_open = true;
               data.hot = e.data.data.hot;
                console.log(data.hot);
        })
        const colse_phone = ()=>{
            data.bind_phone = false;
        }

    public function purchased(){
        $data =Request::param();
        $user=Ticket::get($data['token'],'phpcn');
        $datalist= Db::table('bew_order')
            ->field('w.*')
            ->alias('a')
            ->leftJoin('bew_course w','a.cou_id = w.id')
            ->where('a.uid','=',$user)
            ->where('a.status','=',2)
            ->select()->toArray();
        foreach ($datalist as &$datalist_v){
                $datalist_v['img_s']= $this->get_url().(explode(';',$datalist_v['img']))[0];
                $datalist_v['label_s']= explode(';',$datalist_v['label']);
        }
        //排除调用当前用户已购买过推荐的课程
        $course_id = Db::table('bew_order')
            ->field(' cou_id')
            ->distinct(true)
            ->where('uid','=',$user)
            ->where('status','=',2)
            ->select()->toArray();
        $hot = Db::table('bew_course')
            ->where('is_hot','=',1)
            ->where('id','<>',$course_id[0]['cou_id'])
            ->select()->toArray();
        foreach ($hot as &$hot_v){
            $hot_v['img_s']= $this->get_url().(explode(';',$hot_v['img']))[0];
            $hot_v['label_s']= explode(';',$hot_v['label']);
        }
        //排除调用当前用户已购买过推荐的课程
        $arr= [
            'code'=>0,
            'msg'=>'成功',
            'data'=>[
                'course'=>$datalist,
                'hot'=>$hot
            ]
        ];
        echo  json_encode($arr);
    }

效果图