1.0.1 • Published 2 years ago

@kucial/react-pull-to-refresh v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

@kucial/react-pull-to-refresh

Code mainly is from react-component/m-pull-to-refresh and add some features.

Added Features:

  • SSR rendering for document.body. getScrollContainer={() => typeof window === 'object' ? document.body : null}
  • initialStatus control, can prevent init triggerPullToRefresh when initialStatus='finish'
  • update horizontal move prevent

Install

npm install @kucial/react-pull-to-refresh

Usage

import PullToRefresh from '@kucial/react-pull-to-refresh';
class App extends React.Component {
  state = { refreshing: false };
  render() {
    return (
      <PullToRefresh
        refreshing={this.state.refreshing}
        onRefresh={() => {
          this.setState({ refreshing: true });
          setTimeout(() => {
            this.setState({ refreshing: false });
          }, 1000);
        }}
      >
        <ListOfContent />
      </PullToRefresh>
    );
  }
}

props

type PullToRefreshStatus = 'activate' | 'deactivate' | 'release' | 'finish';
namedescriptiontypedefault
initialStatuspass finish to prevent init refresh tirggerStringundefined
getScrollContainercontainer to attach event handlerFunction() => undefined
directionpull direction, can be up or downStringdown
distanceToRefreshdistance to pull to refreshnumber50
refreshingWhether the view should be indicating an active refreshboolfalse
onRefreshCalled when the view starts refreshing.() => void-
indicatorindicator componentFunction(props: { status: PullToRefreshStatus }) => ReactNode
classNameadditional css class of root dom nodeString-
prefixClsprefix classString'kc-ptr'
dampingpull damping, suggest less than 200number100
scaledamping scalenumber0.6