下拉刷新组件:react-native-refreshable-listview

fpcm 9年前

react-native-refreshable-listview 是下拉刷新 ListView,当数据重载的时候显示加载提示。

下拉刷新组件:react-native-refreshable-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"        />      )    }  })

项目主页:http://www.open-open.com/lib/view/home/1430540951709