bryaneaton13 / React Pull To Refresh
Licence: mit
React component for web pull to refresh
Stars: ✭ 390
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to React Pull To Refresh
XCPullToLoadMoreListView
XCPullToLoadMoreListView-下拉加载更多ListView控件(仿QQ、微信聊天对话列表控件)
Stars: ✭ 24 (-93.85%)
Mutual labels: pull-to-refresh
AnimatedPullToRefresh-master
A Cool pull to refresh widget provided with character animation in header with user defined text. Customise your widget and show off your home screen!!
Stars: ✭ 38 (-90.26%)
Mutual labels: pull-to-refresh
MagiRefresh
swift版下拉刷新,支持多种样式,同时支持,加载动画,网络错误占位(有兴趣学习如何用swift使用runtime的可以看看)
Stars: ✭ 25 (-93.59%)
Mutual labels: pull-to-refresh
smart-react-native-app
React Native 下拉刷新, 分页加载, 侧边栏, Tab导航学习(Android Studio, ES6语法)
Stars: ✭ 56 (-85.64%)
Mutual labels: pull-to-refresh
UCPullRefresh
This is a beautiful drop-down refresh as well as the effect of back to the home page lick UCBrowser
Stars: ✭ 44 (-88.72%)
Mutual labels: pull-to-refresh
ParticlesRefreshLayout-android
Particles Refresh Layout library for Android
Stars: ✭ 15 (-96.15%)
Mutual labels: pull-to-refresh
LottieSwipeRefreshLayout
Pull to refresh layout that shows a Lottie View.
Stars: ✭ 50 (-87.18%)
Mutual labels: pull-to-refresh
vue-data-loading
Another component for infinite scroll and pull down/up to load data.
Stars: ✭ 63 (-83.85%)
Mutual labels: pull-to-refresh
tulip-scroll
📜 多场景的下拉组件和更多,https://artiely.gitee.io/scroll-docs/
Stars: ✭ 44 (-88.72%)
Mutual labels: pull-to-refresh
Refreshable
🌀Pull to refresh and load more function for UIScrollView
Stars: ✭ 31 (-92.05%)
Mutual labels: pull-to-refresh
react-native-smooth-pull-to-refresh
Custom pull to refresh component for React Native
Stars: ✭ 36 (-90.77%)
Mutual labels: pull-to-refresh
LiteRefresh
Nested scrolling UI library for Android based on CoordinatorLayout. Pull-to-refresh and pull-to-load-more are supported.
Stars: ✭ 37 (-90.51%)
Mutual labels: pull-to-refresh
angular-material-swipe-to-refresh
Swipe to refresh (pull to refresh) for Angular Material
Stars: ✭ 15 (-96.15%)
Mutual labels: pull-to-refresh
GeneralRecyclerViewFragment
Can automatically pull down the refresh, pull up the page of RecyclerviewFragment(能够自动下拉刷新,上拉翻页的RecyclerviewFragment)
Stars: ✭ 56 (-85.64%)
Mutual labels: pull-to-refresh
react-pull-to-refresh
npm install react-pull-to-refresh -S
A pull to refresh component for the web.
Based on Andy Peatling's Pull to Refresh for the Web
Usage
Your refresh handler function takes in resolve
and reject
to tell the PullToRefresh component when it's finished.
handleRefresh(resolve, reject) {
// do some async code here
if (success) {
resolve();
} else {
reject();
}
}
Where you want to render the component:
<ReactPullToRefresh
onRefresh={this.handleRefresh}
className="your-own-class-if-you-want"
style={{
textAlign: 'center'
}}>
<h3>Pull down to refresh</h3>
<div>{items}</div>
<div>etc.</div>
</ReactPullToRefresh>
CSS
Use the CSS from the example or from here as a starting point.
All props
PropTypes
-
onRefresh:
PropTypes.func.isRequired
-
icon:
PropTypes.element
- default:
<span className="genericon genericon-next"></span>
-
loading:
PropTypes.element
- default:
<div className="loading"> <span className="loading-ptr-1"></span> <span className="loading-ptr-2"></span> <span className="loading-ptr-3"></span> </div>
-
disabled:
PropTypes.bool
-
className:
PropTypes.string
-
style:
PropTypes.object
-
distanceToRefresh:
PropTypes.number
-
default:
70
-
default:
-
resistance:
PropTypes.number
-
default:
2.5
-
default:
-
hammerOptions:
PropTypes.object
Thanks
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].