Преглед изворни кода

Video.vue 页面获取数据时添加一个 loading 遮罩

reghao пре 2 година
родитељ
комит
730865c3cf
1 измењених фајлова са 17 додато и 4 уклоњено
  1. 17 4
      src/views/home/Video.vue

+ 17 - 4
src/views/home/Video.vue

@@ -22,14 +22,14 @@
         </el-card>
       </el-col>
       <!--电影列表-->
-      <el-col :md="20">
+      <el-col v-loading="loading" :md="20">
         <el-col v-for="(video, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
           <video-card :video="video" />
         </el-col>
-        <el-col v-if="totalSize === 0" class="not-result" :md="6" :sm="12" :xs="12">
+<!--        <el-col v-if="totalSize === 0" class="not-result" :md="6" :sm="12" :xs="12">
           <img src="@/assets/img/icon/not-result.png">
           <div>没有视频数据</div>
-        </el-col>
+        </el-col>-->
         <!--
           分页按钮:
           page-size:每页显示条数
@@ -72,7 +72,8 @@ export default {
         children: 'children',
         label: 'label',
         value: 'value'
-      }
+      },
+      loading: false
     }
   },
   created() {
@@ -123,7 +124,17 @@ export default {
       scrollTo(0, 0)
     },
     videoPageWrapper(categoryId, currentPage) {
+      /* const loading = this.$loading({
+        lock: true,
+        text: 'Loading',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })*/
+
+      this.loading = true
       categoryVideos(categoryId, currentPage).then(resp => {
+        // loading.close()
+        this.loading = false
         if (resp.code === 0) {
           const respData = resp.data
           this.dataList = respData.list
@@ -137,6 +148,8 @@ export default {
           })
         }
       }).catch(error => {
+        // loading.close()
+        this.loading = false
         this.$notify({
           title: '提示',
           message: error.message,