优化滚动

src/components/infiniteScroll/index.tsx

@@ -4,12 +4,14 @@ import style from "./index.module.scss"
 import DotLoading from "@/components/dotLoading"
 import LoadingCard from "../loadingCard"
 
+export type StatusParam = 0|1|2|3
+
 type Params = {
     styleObj?: Object,
     selfonScrollToLower?: () => void,
-    hasMore?: false|true,
+    hasMore?: false|true, 
     moreStatus?: false|true,
-    statusMore?: 0|1|2, //0:没数据加载，1：下拉加载，2：没有数据
+    statusMore?: StatusParam //0:数据从无到有加载数据，1，没有任何数据， 2：下拉加载，3：下拉没有数据
     children?: ReactNode,
     lowerThresholdNum?: number,
     selfOnScrollToUpper?:() => void
@@ -80,20 +82,28 @@ export default memo(({
                 onRefresherAbort = {() => refresherAbort()}
                 refresherBackground ='#F8F8F8'
             >
-                {(statusMore != 0)&&<View style={{paddingBottom:paddingBottom + 'rpx'}} className={style.scrollViewCon}>
-                    {children}
-                    {moreStatus&&<View className={style.infinite_scroll}>
-                        {
-                            hasMore&&<View className={style.loading_more}>加载中<DotLoading/></View>||
-                            <View>没有更多数据了</View>
-                        }
-                    </View>}
-                </View>||
-                <LoadingCard/>
-                }
+                {!moreStatus&&<>
+                    <View style={{paddingBottom:paddingBottom + 'rpx'}} className={style.scrollViewCon}>
+                        {children}
+                    </View>
+                </>||
+                <>
+                    {(statusMore == 2 || statusMore == 3)&&<View style={{paddingBottom:paddingBottom + 'rpx'}} className={style.scrollViewCon}>
+                            {children}
+                            <View className={style.infinite_scroll}>
+                                {
+                                    (statusMore == 2)&&<View className={style.loading_more}>加载中<DotLoading/></View>||
+                                    <View>没有更多数据了</View>
+                                }
+                            </View>
+                        </View>
+                    }
+                    {(statusMore == 0)&&<LoadingCard/>}
+                    {(statusMore == 1)&&<LoadingCard loadingIcon={false} title="暂无数据"/>}
+                </>}
+                
                 <View className="common_safe_area_y"></View>
             </ScrollView>
-            
         </>
     )
 })

src/components/sideBar/index.tsx

@@ -1,13 +1,12 @@
 import { ScrollView, View } from "@tarojs/components"
-import { memo, ReactNode, useEffect, useRef, useState } from "react"
+import React, { memo, ReactNode, useEffect, useRef, useState } from "react"
 import styles from "./index.module.scss"
 import classnames from "classnames";
 import Taro, { useReady } from "@tarojs/taro";
-import InfiniteScroll from "../infiniteScroll";
+import InfiniteScroll, {StatusParam} from "../infiniteScroll";
 import LoadingCard from "../loadingCard";
 
 
-
 type Params = {
     list?: any[],
     defaultValue?: number|string,
@@ -18,7 +17,8 @@ type Params = {
     refresherTriggered?: true|false,
     selfOnRefresherRefresh?: () => void
     selfOnScrolltolower?: () => void,
-    hasMore?: true|false
+    hasMore?: true|false,
+    statusMore?: StatusParam
 }
 
 export default memo(({list = [], 
@@ -30,7 +30,8 @@ export default memo(({list = [],
     refresherTriggered = false,
     selfOnRefresherRefresh,
     selfOnScrolltolower,
-    hasMore = true
+    hasMore = true,
+    statusMore = 0
 }: Params) => {
     
     let num_half = useRef(0)
@@ -82,8 +83,6 @@ export default memo(({list = [],
         })
     })
 
-   
-
     return (
         <>
             <View className={classnames(styles.sideBar_main,'side_bar_select')}>
@@ -108,8 +107,7 @@ export default memo(({list = [],
                     <View className="common_safe_area_y"></View>
                 </ScrollView>
                 <View className={styles.sideBar_con}>
-                    
-                    <InfiniteScroll hasMore={hasMore} selfonScrollToLower={() => selfOnScrolltolower?.()} refresherTriggered={refresherTriggered} refresherEnabled={true} selfOnRefresherRefresh={() => selfOnRefresherRefresh?.()}>
+                    <InfiniteScroll statusMore={statusMore} hasMore={hasMore} selfonScrollToLower={() => selfOnScrolltolower?.()} refresherTriggered={refresherTriggered} refresherEnabled={true} selfOnRefresherRefresh={() => selfOnRefresherRefresh?.()}>
                         {children}
                     </InfiniteScroll>
                 </View>