https://github.com/aircloud/reactscroller
An universal scroll component for React
https://github.com/aircloud/reactscroller
Last synced: 10 months ago
JSON representation
An universal scroll component for React
- Host: GitHub
- URL: https://github.com/aircloud/reactscroller
- Owner: aircloud
- Created: 2017-07-15T09:15:43.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-08-13T12:23:18.000Z (almost 9 years ago)
- Last Synced: 2025-08-03T04:51:28.534Z (10 months ago)
- Language: JavaScript
- Size: 43 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
An universal scroll component for React
## usage
```
npm i reactscroller --save
```
and then you can(ES6):
```
import ReactScoller from "reactscroller";
```
or:
```
var ReactScoller = require("reactscroller");
```
You can visit [ReactScrollerExample](https://github.com/aircloud/ReactScrollerExample) to find more details for usage.
**The following is a list of incoming properties:**
| property | Optional | Default | description | type |
| ------| ------ | ------ | ------ | ------ |
| containerHeight | Necessary | null | The height for the outer container to scroll | String \| Number |
| containerWidth | Optional | 100% | The width for the outer container to scroll |String \| Number |
| refresh | Optional | null | The function for pull down to refresh | Function |
| loadMore | Optional | null | The function for scroll up to load more | Function |
| lowerBound | Optional | 50 | The distance to the bottom when trigger the function loadmore | Number |
| refreshTip | Necessary | null | The refreshTip for the different stages of refreshing(a property of `this.state` is better. It should be changed) | String or Component |
| loadMoreTip | Necessary | null | The loadmoreTip for the different stages of loading more (a property of `this.state` is better. It should be changed) | String or Component |
| showRefresh | Necessary | null | Whether the refreshTip should be displayed | bool |
| showLoadMore | Necessary | null | Whether the loadMoreTip should be displayed | bool |
## Advanced
I peeled off the core module and the presentation module during the coding phase. So you can use the `ReactScrollerCore` to make more customization.
```
import {ReactScrollerCore} from "reactscroller";
```
I continue thinking and testing, if you have some good ideas please visit [issues](https://github.com/aircloud/ReactScroller/issues)
## License
MIT