下拉刷新組件: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 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!