版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/phj_88/article/details/82177329
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"
/>
)
}
})
博主花大量时间和精力整理了大前端最新前端视频教程,省去大家找资源的时间
有兴趣的可以点击下方文字访问博主淘宝网(感谢支持)或直接联系博主QQ:184009766