🎈 perf(购物页面): 新增下拉刷新数据

src/pages/shopping/index.tsx

@@ -45,7 +45,7 @@ export const Shopping: FC = memo(() => {
   )
 })
 
-interface InternalContainer { }
+interface InternalContainer {}
 
 const ShoppingCartContainer: FC<InternalContainer> = () => {
   const { isManageStatus, setManageStatus, selectedAmount, currentCheckedPurchaserId, currentCheckedSaleMode, colorStore, setColorStore } = useShoppingContext()
@@ -59,12 +59,17 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
 
   const { fetchData, state } = ShoppingCartListApi()
 
+  const [searchOptions, setSearchOptions] = useState({
+    short_name_or_phone: '',
+  })
+
+  useEffect(() => {
+    fetchData(searchOptions)
+  }, [searchOptions])
+
   // 输入了搜索关键字
   const getSearchData = useCallback(e => {
-    fetchData({ short_name_or_phone: e })
-    // pageNum.current.page = 1
-    // setOrderData(() => ({ list: [], total: 0 }))
-    // setSearchField((val) => ({ ...val, name: e, size: 10 }))
+    setSearchOptions(prev => ({ ...prev, short_name_or_phone: e }))
   }, [])
 
   const [shoppingCartData, setShoppingCartData] = useState<{ list: ShoppingCartData[]; total: number }>({ list: [], total: 0 })
@@ -104,7 +109,7 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
     if (!targetGoodsKind) return Taro.showToast({ title: '请先选择客户', icon: 'error' })
     const checkedGoodsKind = Object.values(targetGoodsKind).reduce((prev, item: Goods) => {
       if (item.checked) {
-        return [...prev,item.id]
+        return [...prev, item.id]
       }
       return prev
     }, [])
@@ -153,6 +158,24 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
     setColorStore(() => tempObject)
   }
 
+  // 加载刷新数据
+  const [refreshStatus, setRefreshStatus] = useState(false)
+
+  // 下拉刷新
+  const handleRefresh = async () => {
+    setRefreshStatus(true)
+    const res = await fetchData(searchOptions)
+    if (res.success) {
+      console.log('请求 成功')
+      setRefreshStatus(false)
+      Taro.showToast({ title: '刷新成功', icon: 'success' })
+    } else {
+      console.log('请求 失败')
+      Taro.showToast({ title: '刷新失败', icon: 'error' })
+      setRefreshStatus(false)
+    }
+  }
+
   return (
     <View className={classnames('flex-col', styles.shopping)} id='shoppingContainer'>
       <View className={styles['shopping--topBar']} id='topBar'>
@@ -168,7 +191,11 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
       </View>
       <View className={classnames('flex-item', 'flex-col', styles['shopping--context'])}>
         <View className={classnames(styles.shopping__list__container, 'flex-item')} style={{ height: listHeight }}>
-          <InfiniteScroll statusMore={statusMore}>
+          <InfiniteScroll
+            statusMore={statusMore}
+            refresherEnabled={true}
+            selfOnRefresherRefresh={handleRefresh}
+            refresherTriggered={refreshStatus}>
             {!!shoppingCartData?.list?.length &&
               shoppingCartData?.list?.map((item, index) => {
                 return <ItemList itemData={item} key={index}></ItemList>