修改课程页面的loading效果

src/pages/learn/course.vue

@@ -29,7 +29,7 @@
     <!-- <el-button class="rbtn" type="primary" size="medium" icon="el-icon-self-cc-book icon" @click="goCourseAll">{{ $t('pages.learn.course.changeCourse') }}</el-button> -->
   </div>
 
-  <div class="con-box">
+  <div class="con-box" v-loading="loading">
     <ul class="course-list">
       <template v-for="(item, index) in homeList">
         <li v-bind:key="index" class="item">
@@ -99,7 +99,8 @@ export default {
       homeList: [], // 从后台请求
       param: {},
       timeInterval: null,
-      newLiveMsg: {}
+      newLiveMsg: {},
+      loading: false
     }
   },
   mounted () {
@@ -112,11 +113,10 @@ export default {
     // 定时获取最新直播
     this.timeInterval = setInterval(this.getLatestLive, 10000)
 
-    const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
     cAction.Course.getLearnFind().then(data => {
       this.find[0].arrItem = data
       this.getAjaxList(true, this.$t('pages.learn.course.goCourseAllStr'))
-    }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
+    }).catch(e => { this.$message.error(e.message) }).finally(() => { })
   },
   destroyed () {
     if (this.timeInterval) {
@@ -134,12 +134,15 @@ export default {
       this.$router.push({ path: `/app/learn/course-detail/${sid}/${cid}` })
     },
     getAjaxList (bool, str) {
+      this.loading = true
       cAction.Course.getCourseList(bool, this.param).then(json => {
         this.homeList = json
         if (!json.length) {
           this.$message(str)
         }
-      }).catch(e => { this.$message.error(e.message) }).finally(() => {})
+      }).catch(e => { this.$message.error(e.message) }).finally(() => {
+        this.loading = false
+      })
     },
     /**
      * 分类选择 - 选中某一项