https://github.com/little-buddy/react-native-mr-pullrefresh
Mr.pullrefresh is a pure javascript pull-refresh library for react-native. Support iOS、Android、Web 🎸
https://github.com/little-buddy/react-native-mr-pullrefresh
android ios pullrefresh react react-native web
Last synced: 11 months ago
JSON representation
Mr.pullrefresh is a pure javascript pull-refresh library for react-native. Support iOS、Android、Web 🎸
- Host: GitHub
- URL: https://github.com/little-buddy/react-native-mr-pullrefresh
- Owner: little-buddy
- License: mit
- Created: 2023-09-03T11:49:10.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-09-13T19:56:30.000Z (over 2 years ago)
- Last Synced: 2025-03-20T22:35:50.309Z (11 months ago)
- Topics: android, ios, pullrefresh, react, react-native, web
- Language: TypeScript
- Homepage:
- Size: 26.3 MB
- Stars: 6
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# react-native-mr-pullrefresh
```
/\/\ _ __ / _ \_ _| | | /__\ ___ / _|_ __ ___ ___| |__
/ \| '__| / /_)/ | | | | |/ \/// _ \ |_| '__/ _ \/ __| '_ \
/ /\/\ \ | _ / ___/| |_| | | / _ \ __/ _| | | __/\__ \ | | |
\/ \/_| (_) \/ \__,_|_|_\/ \_/\___|_| |_| \___||___/_| |_|
```
react-native pull refresh on iOS, Android and Web
## 💪🏻 Support
| Platform | | solved |
| -------- | ----------- | ----------- |
| iOS | ✅ | 🔥 Perfect |
| Android | ✅ | 😂 Bottom response is bad |
| Web | ✅ | 😭 Pulling and scrolling cant switch smoothly |
| Library | |
| -------- | ----------- |
| react-native-gesture-handler | 2.x |
| react-native-reanimated | 3.x |
#### ⚠️ Warning
`react-native-mr-pullrefresh` Only support wrapper `Animated.ScrollView` and `Animated.FlatList`
not support nested MrPullRefresh!
## Installation
It relies on `react-native-gesture-handler` and `react-native-reanimated`
so please install them before you use this package
```sh
yarn install react-native-gesture-hanlder react-native-reanimated
```
```sh
yarn install react-native-mr-pullrefresh
```
## Usage
```js
import { MrPullRefresh } from 'react-native-mr-pullrefresh';
// ...
null}
/>
{/* or*/}
{/* children */}
```
## Example
| 
| 
|
| :--------: | :-----------: |
| iOS | Android |
## Props
| props | type | description | Default |
| ----------------- | --------- | ------------------------------------------------------------ | -------- |
| pulldownHeight | Number | The height of the drop-down load component is defined, and the judgment of the drop-down state depends on this value | 140 |
| pullupHeight | Number | The height of the pull-up component is defined, and the pull-up state is determined by this value | 100 |
| containerFactor | Number | The container factor is used to adjust the height of the refresh judgment | 0.5 |
| pullingFactor | Number | Determine the coefficient of pulling state length | 2.2 |
| enablePullup | Boolean | whether show pullingupLoading | false |
| pulldownLoading | Component | You can custom the Component | |
| pullupLoading | Component | You can custom the Component | |
| | | | |
| onPulldownRefresh | Function | callback of pulling down refresh, load data with it | ()=>void |
| onPullupRefresh | Function | callback of pulling up refresh, load data with it | ()=>void |
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT
---
Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)