noder-react-native
noder-react-native copied to clipboard
列表个数比较少的时候,会有个loading一直在闪
如题
列表项比较多的时候没有这个问题出现
测试环境,ios,dev模式
测试效果如下图
抓包看请求发现,进入列表有的时候会请求两次同一页的数据,如果列表过少或列表为空,就会狂刷接口,page值递增,也不能说递增,有重复请求的递增,而且有丢页的现象
恩恩,这是个bug, 我待会看看,
@soliury
这是react native本身的组件兼容bug,可以看下这个 http://www.codeismoney.com/ReactNative/262_React-Native-ListView-onEndReached.html
http://stackoverflow.com/questions/30262404/react-native-infinite-scroll
@soliury
自己改了下,效果还可以,不用改页面结构,参考上面贴的stackoverflow的帖子 修改 layouts/TopicList.js
constructor(props) { super(props); var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); this.state = { isLoadingTail: false, ds: ds.cloneWithRows(props.data) }; this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this); } getSCData() { const {tab, limit, page, actions, data} = this.props; if (data.length) { actions.getTopicsByTab(tab, { page: page + 1, limit }); this.setState({ isLoadingTail: false }); } } _onEndReached() { if (this.state.isLoadingTail) { return; } this.setState({ isLoadingTail: true, dataSource: this.getSCData() }); console.log('onEndReached', this.state.isLoadingTail); }