下拉刷新組件:react-native-refreshable-listview
react-native-refreshable-listview 是下拉刷新 ListView,當數據重載的時候顯示加載提示。
var React = require('react-native') var {Text, View, ListView} = React var ArticleStore = require('../stores/ArticleStore') var StoreWatchMixin = require('./StoreWatchMixin') var ArticleView = require('./ArticleView') var RefreshableListView = require('./RefreshableListView') var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1.id !== r2.id}) var ArticlesScreen = React.createClass({ mixins: [StoreWatchMixin], getInitialState() { return {dataSource: ds.cloneWithRows(ArticleStore.all())} }, getStoreWatches() { this.watchStore(ArticleStore, () => { this.setState({dataSource: ds.cloneWithRows(ArticleStore.all())}) }) }, reloadArticles() { return ArticleStore.reload() // returns a promise of reload completion }, renderArticle(article) { return <ArticleView article={article} /> }, render() { return ( <RefreshableListView dataSource={this.state.dataSource} renderRow={this.renderArticle} loadData={this.reloadArticles} refreshDescription="Refreshing articles" /> ) } })
本文由用戶 fpcm 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!