From 8291ab49d7045c7f451e141935b01e8acb366173 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Fri, 15 Apr 2022 13:50:38 +0800 Subject: [PATCH] =?UTF-8?q?=E5=88=86=E7=B1=BB=E7=AD=9B=E9=80=89=E4=BC=98?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/infiniteScroll/index.tsx | 19 ++++++++++--------- src/components/shopCart/index.module.scss | 3 ++- src/components/shopCart/index.tsx | 9 ++++++++- src/components/swiper/index.tsx | 6 ++++++ .../details/components/orderCount/index.tsx | 7 +++++++ .../components/swiper/index.module.scss | 1 + src/pages/details/components/swiper/index.tsx | 8 ++++---- src/pages/details/index.module.scss | 1 - 8 files changed, 38 insertions(+), 16 deletions(-) diff --git a/src/components/infiniteScroll/index.tsx b/src/components/infiniteScroll/index.tsx index bfb897e..b30d01b 100644 --- a/src/components/infiniteScroll/index.tsx +++ b/src/components/infiniteScroll/index.tsx @@ -9,9 +9,9 @@ type Params = { hasMore?: false|true, children?: ReactNode, lowerThresholdNum?: number, - + paddingBottom?: number } -export default memo(({styleObj, selfonScrollToLower, hasMore=true, children, lowerThresholdNum = 5}: Params) => { +export default memo(({styleObj, selfonScrollToLower, hasMore=true, children, lowerThresholdNum = 5, paddingBottom = 0}: Params) => { const scrollToLower = () => { selfonScrollToLower?.() } @@ -24,15 +24,16 @@ export default memo(({styleObj, selfonScrollToLower, hasMore=true, children, low onScrollToLower={() => scrollToLower()} lowerThreshold={lowerThresholdNum} > - + {children} + + { + hasMore&&加载中|| + 没有更多了 + } + - - { - hasMore&&加载中|| - 没有更多了 - } - + diff --git a/src/components/shopCart/index.module.scss b/src/components/shopCart/index.module.scss index 4d6405b..61142a4 100644 --- a/src/components/shopCart/index.module.scss +++ b/src/components/shopCart/index.module.scss @@ -40,7 +40,8 @@ } } .con{ - padding:30px 20px 100px 0; + padding:30px; + padding-bottom: 0; box-sizing: border-box; flex:1; height: 0; diff --git a/src/components/shopCart/index.tsx b/src/components/shopCart/index.tsx index 739421d..8e22413 100644 --- a/src/components/shopCart/index.tsx +++ b/src/components/shopCart/index.tsx @@ -23,6 +23,7 @@ export default ({show = false, onClose}: param) => { const [loading, setLoading] = useState(false) useEffect(() => { + if(!show) return let lists:any[] = [] for(let i = 0; i < 20; i++) { lists = [...lists, { @@ -33,6 +34,12 @@ export default ({show = false, onClose}: param) => { }] } setList([...lists]) + }, [show]) + + useEffect(() => { + return () => { + setList([]) + } }, []) const [showPopup, setShowPopup] = useState(false) @@ -104,7 +111,7 @@ export default ({show = false, onClose}: param) => { {loading&&} - {!loading&&list.length > 0&& {console.log('触底了')}}> + {!loading&&list.length > 0&& {console.log('触底了')}} paddingBottom={100}> {list.map((item, index) => { return diff --git a/src/components/swiper/index.tsx b/src/components/swiper/index.tsx index 2e49e14..af56652 100644 --- a/src/components/swiper/index.tsx +++ b/src/components/swiper/index.tsx @@ -18,6 +18,12 @@ export default (props:params) => { img:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d', url:'', id:1 + }, + { + title:'数据', + img:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d', + url:'', + id:2 } ] diff --git a/src/pages/details/components/orderCount/index.tsx b/src/pages/details/components/orderCount/index.tsx index c0a258f..eb5c0c4 100644 --- a/src/pages/details/components/orderCount/index.tsx +++ b/src/pages/details/components/orderCount/index.tsx @@ -30,6 +30,7 @@ export default memo(({show = false, onClose}: param) => { console.log('执行执行') useEffect(() => { + if(!show) return let lists:any[] = [] for(let i = 0; i < 20; i++) { lists = [...lists, { @@ -41,6 +42,12 @@ export default memo(({show = false, onClose}: param) => { }] } setList([...lists]) + }, [show]) + + useEffect(() => { + return () => { + setList([]) + } }, []) const [showPopup, setShowPopup] = useState(false) diff --git a/src/pages/details/components/swiper/index.module.scss b/src/pages/details/components/swiper/index.module.scss index 28a5df5..f65584e 100644 --- a/src/pages/details/components/swiper/index.module.scss +++ b/src/pages/details/components/swiper/index.module.scss @@ -12,6 +12,7 @@ image{ width: 100%; height: 100%; + display: block; } } .page{ diff --git a/src/pages/details/components/swiper/index.tsx b/src/pages/details/components/swiper/index.tsx index ac52db5..c05ed1a 100644 --- a/src/pages/details/components/swiper/index.tsx +++ b/src/pages/details/components/swiper/index.tsx @@ -21,11 +21,11 @@ export default ({list = []}: params) => { return ( - swiperChange(e)}> - {list.map(item => { - return + swiperChange(e)}> + {list.map((item) => { + return - + })} diff --git a/src/pages/details/index.module.scss b/src/pages/details/index.module.scss index 371cbe5..1c1f42a 100644 --- a/src/pages/details/index.module.scss +++ b/src/pages/details/index.module.scss @@ -78,7 +78,6 @@ .item_color{ width:210px; height: 210px; - background-color: red; border-radius: 20px; image{ width: 100%;