【fix】优化代码

components/canvasShow/basics/product/app/index.vue

@@ -1,6 +1,6 @@
 <template>
   <global-loading />
-  <div class="hom-pro-list">
+  <div class="hom-pro-list" v-if="productData.length > 0">
     <div class="header">
       <div class="header-warp">
         <div class="title">商品推荐</div>
@@ -115,7 +115,7 @@
 
       <div
           class="product-list-box"
-          v-if="productData.length>0">
+          v-if="!loading">
         <div
             class="product-list-item-warp"
             v-for="(col,i) in colList"
@@ -216,7 +216,7 @@ const props = defineProps({
   },
 });
 const {typeId, componentContent} = toRefs(props);
-const {productData, jumpProductDetail, jumpProList, loadNext, getPercentageNum} = productMixin(componentContent);
+const {productData, jumpProductDetail, jumpProList, loadNext, getPercentageNum, loading} = productMixin(componentContent);
 const swiperCurrent = ref(0)
 
 const colList = computed(() => [

components/canvasShow/basics/product/mixin.js

@@ -6,11 +6,13 @@ export default function (componentContent) {
   const { sendReq, beforeGetData, afterGetData, jumpProductDetail, jumpProList } = funMixin()
 
   const productData = ref([])
+  const loading = ref(true)
   onMounted(() => {
     getData(true)
   })
 
   function getData (isFirst) {
+    loading.value = true
     if (componentContent.value.productData.sourceType === '1') {
       if (
           componentContent.value.productData.productIdList?.length > 0
@@ -24,12 +26,14 @@ export default function (componentContent) {
             (proRes) => {
               afterGetData()
               productData.value = proRes.data.list
+              loading.value = false
               if (isFirst) {
                 componentContent.value.productData.imgTextData = productData.value
               }
             },
             () => {
               afterGetData()
+              loading.value = false
             }
         )
       } else {
@@ -45,6 +49,7 @@ export default function (componentContent) {
             },
             (proRes) => {
               afterGetData()
+              loading.value = false
               productData.value = proRes.data.list
               if (isFirst) {
                 componentContent.value.productData.imgTextData = productData.value
@@ -53,6 +58,7 @@ export default function (componentContent) {
             },
             () => {
               afterGetData()
+              loading.value = false
             }
         )
       } else {
@@ -73,6 +79,7 @@ export default function (componentContent) {
     productData,
     jumpProductDetail,
     jumpProList,
-    getPercentageNum
+    getPercentageNum,
+    loading
   }
 }