From 22c8d11b9b098963c2f7a9bce8b3098522a73e1e Mon Sep 17 00:00:00 2001 From: oasis Date: Mon, 30 Dec 2024 10:50:54 +0800 Subject: [PATCH 1/2] feat(pulltorefresh): v15 --- src/packages/pulltorefresh/demos/h5/demo1.tsx | 19 +++--------------- src/packages/pulltorefresh/demos/h5/demo2.tsx | 20 ++++--------------- .../pulltorefresh/demos/taro/demo1.tsx | 18 ++++------------- .../pulltorefresh/demos/taro/demo3.tsx | 18 ++++------------- src/packages/pulltorefresh/pulltorefresh.scss | 2 +- .../pulltorefresh/pulltorefresh.taro.tsx | 2 +- src/packages/pulltorefresh/pulltorefresh.tsx | 2 +- 7 files changed, 18 insertions(+), 63 deletions(-) diff --git a/src/packages/pulltorefresh/demos/h5/demo1.tsx b/src/packages/pulltorefresh/demos/h5/demo1.tsx index 46260afeef..8f69b10ffb 100644 --- a/src/packages/pulltorefresh/demos/h5/demo1.tsx +++ b/src/packages/pulltorefresh/demos/h5/demo1.tsx @@ -1,5 +1,6 @@ import React, { useState } from 'react' -import { PullToRefresh, Toast } from '@nutui/nutui-react' +import { Lottie, PullToRefresh, Toast } from '@nutui/nutui-react' +import lightPull from '@/packages/lottie/animation/light/pulltorefresh.json' const Demo1 = () => { const [list] = useState([1, 2, 3, 4, 5, 6, 7]) @@ -15,21 +16,7 @@ const Demo1 = () => { renderIcon={(status) => { return ( <> - {(status === 'pulling' || status === 'complete') && ( - - - - )} - {(status === 'canRelease' || status === 'refreshing') && ( - - - - - - )} + ) }} diff --git a/src/packages/pulltorefresh/demos/h5/demo2.tsx b/src/packages/pulltorefresh/demos/h5/demo2.tsx index c9cae56754..73c873f14c 100644 --- a/src/packages/pulltorefresh/demos/h5/demo2.tsx +++ b/src/packages/pulltorefresh/demos/h5/demo2.tsx @@ -1,5 +1,6 @@ import React, { useState } from 'react' -import { PullToRefresh, Toast } from '@nutui/nutui-react' +import { Lottie, PullToRefresh, Toast } from '@nutui/nutui-react' +import whitePull from '@/packages/lottie/animation/dark/pulltorefresh-white.json' const Demo1 = () => { const [list] = useState([1, 2, 3, 4, 5, 6, 7]) @@ -16,21 +17,7 @@ const Demo1 = () => { renderIcon={(status) => { return ( <> - {(status === 'pulling' || status === 'complete') && ( - - - - )} - {(status === 'canRelease' || status === 'refreshing') && ( - - - - - - )} + ) }} @@ -41,6 +28,7 @@ const Demo1 = () => { textAlign: 'center', height: '50px', lineHeight: '50px', + color: 'white', }} key={item} > diff --git a/src/packages/pulltorefresh/demos/taro/demo1.tsx b/src/packages/pulltorefresh/demos/taro/demo1.tsx index efabca17ea..aedbbcf492 100644 --- a/src/packages/pulltorefresh/demos/taro/demo1.tsx +++ b/src/packages/pulltorefresh/demos/taro/demo1.tsx @@ -1,8 +1,9 @@ import React, { useState } from 'react' -import { Image, View } from '@tarojs/components' -import { PullToRefresh } from '@nutui/nutui-react-taro' +import { View } from '@tarojs/components' +import { PullToRefresh, Lottie } from '@nutui/nutui-react-taro' import Taro from '@tarojs/taro' import pxTransform from '@/utils/px-transform' +import lightPull from '@/packages/lottie/animation/light/pulltorefresh.json' const Demo1 = () => { const [list] = useState([1, 2, 3, 4, 5, 6, 7]) @@ -26,18 +27,7 @@ const Demo1 = () => { renderIcon={(status) => { return ( <> - {(status === 'pulling' || status === 'complete') && ( - - )} - {(status === 'canRelease' || status === 'refreshing') && ( - - )} + ) }} diff --git a/src/packages/pulltorefresh/demos/taro/demo3.tsx b/src/packages/pulltorefresh/demos/taro/demo3.tsx index 933b3bd686..8e4c4d0bfa 100644 --- a/src/packages/pulltorefresh/demos/taro/demo3.tsx +++ b/src/packages/pulltorefresh/demos/taro/demo3.tsx @@ -1,8 +1,9 @@ import React, { useState } from 'react' -import { Image, Text, View } from '@tarojs/components' -import { PullToRefresh } from '@nutui/nutui-react-taro' +import { Text, View } from '@tarojs/components' +import { Lottie, PullToRefresh } from '@nutui/nutui-react-taro' import Taro from '@tarojs/taro' import pxTransform from '@/utils/px-transform' +import lightPull from '@/packages/lottie/animation/light/pulltorefresh.json' const Demo1 = () => { const [list] = useState([1, 2, 3, 4, 5, 6, 7]) @@ -22,18 +23,7 @@ const Demo1 = () => { renderIcon={(status) => { return ( <> - {(status === 'pulling' || status === 'complete') && ( - - )} - {(status === 'canRelease' || status === 'refreshing') && ( - - )} + ) }} diff --git a/src/packages/pulltorefresh/pulltorefresh.scss b/src/packages/pulltorefresh/pulltorefresh.scss index 21ee71381c..7a16567fcb 100644 --- a/src/packages/pulltorefresh/pulltorefresh.scss +++ b/src/packages/pulltorefresh/pulltorefresh.scss @@ -9,7 +9,7 @@ bottom: 0; left: 0; width: 100%; - color: $color-title; + color: $color-text-help; display: flex; flex-direction: column; justify-content: center; diff --git a/src/packages/pulltorefresh/pulltorefresh.taro.tsx b/src/packages/pulltorefresh/pulltorefresh.taro.tsx index acb2730b84..4f92ea3dbb 100644 --- a/src/packages/pulltorefresh/pulltorefresh.taro.tsx +++ b/src/packages/pulltorefresh/pulltorefresh.taro.tsx @@ -39,7 +39,7 @@ const defaultProps = { completeText: '', completeDelay: 500, disabled: false, - headHeight: 50, + headHeight: 64 + 16, threshold: 60, scrollTop: 0, onRefresh: () => {}, diff --git a/src/packages/pulltorefresh/pulltorefresh.tsx b/src/packages/pulltorefresh/pulltorefresh.tsx index d1046c5f83..e49f3f3f14 100644 --- a/src/packages/pulltorefresh/pulltorefresh.tsx +++ b/src/packages/pulltorefresh/pulltorefresh.tsx @@ -43,7 +43,7 @@ const defaultProps = { completeText: '', completeDelay: 500, disabled: false, - headHeight: 50, + headHeight: 64 + 16, threshold: 60, onRefresh: () => {}, } as PullToRefreshProps From 35916b28792a7ec3e8b70e7fde086c7e590da84f Mon Sep 17 00:00:00 2001 From: oasis Date: Mon, 30 Dec 2024 17:10:27 +0800 Subject: [PATCH 2/2] feat(pulltorefresh): v15 --- src/packages/pulltorefresh/pulltorefresh.taro.tsx | 2 +- src/packages/pulltorefresh/pulltorefresh.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/packages/pulltorefresh/pulltorefresh.taro.tsx b/src/packages/pulltorefresh/pulltorefresh.taro.tsx index 4f92ea3dbb..c98e8b58f0 100644 --- a/src/packages/pulltorefresh/pulltorefresh.taro.tsx +++ b/src/packages/pulltorefresh/pulltorefresh.taro.tsx @@ -39,7 +39,7 @@ const defaultProps = { completeText: '', completeDelay: 500, disabled: false, - headHeight: 64 + 16, + headHeight: 80, threshold: 60, scrollTop: 0, onRefresh: () => {}, diff --git a/src/packages/pulltorefresh/pulltorefresh.tsx b/src/packages/pulltorefresh/pulltorefresh.tsx index e49f3f3f14..03250d3be8 100644 --- a/src/packages/pulltorefresh/pulltorefresh.tsx +++ b/src/packages/pulltorefresh/pulltorefresh.tsx @@ -43,7 +43,7 @@ const defaultProps = { completeText: '', completeDelay: 500, disabled: false, - headHeight: 64 + 16, + headHeight: 80, threshold: 60, onRefresh: () => {}, } as PullToRefreshProps