diff --git a/src/component/customedList.js b/src/component/customedList.js deleted file mode 100644 index d1b6caf..0000000 --- a/src/component/customedList.js +++ /dev/null @@ -1,97 +0,0 @@ -import React, {Component} from 'react'; -import {StyleSheet, Text, View, InteractionManager, FlatList} from 'react-native'; - - -export default class CustomedList extends Component { - - constructor(props) { - super(props); - - this.listType = props.listType || 'undefined'; - this.dataSource = props.dataSource; - - this.state = { - listData: [], - hasMore: false, - - refreshing: false, - refreshFailed: false - }; - } - - componentDidMount() { - InteractionManager.runAfterInteractions(() => { - this.refresh(); - }); - } - - refresh(loadMore = false) { - if (this.state.refreshing) { - return; - } - - this.setState({hasMore: false, refreshing: true, refreshFailed: false}); - this.dataSource.refresh(loadMore) - .then(result => { - if(!result) { - throw { - message: 'refresh ' + this.listType + ' no result' - } - - } else { - console.log('refresh ' + this.listType + ' result:', result); - - this.setState({ - listData: result.list ? result.list : [], - hasMore: result.more, - refreshFailed: false - }); - } - - }).catch(e => { - this.setState({ - listData: [], - hasMore: false, - refreshFailed: true - }); - - }).done(() => { - this.setState({ - refreshing: false - }); - }); - } - - loadMore() { - if (this.state.refreshing) { - return; - } - - this.refresh(true); - } - - render() { - return ( - <FlatList - - data={this.state.listData} - - keyExtractor={(item, index) => { - return item.id ? item.id.toString() : index; - }} - - renderItem={this.props.renderItem} - - refreshing={this.state.refreshing} - onRefresh={this.refresh.bind(this)} - - onEndReachedThreshold={5} - onEndReached={this.state.hasMore ? this.loadMore.bind(this) : null} - /> - ); - } -} - -const localStyle = StyleSheet.create({ - -}); diff --git a/src/component/follow/followUserList.js b/src/component/follow/followUserList.js index 7d5c5b9..bc3ffe7 100644 --- a/src/component/follow/followUserList.js +++ b/src/component/follow/followUserList.js @@ -6,7 +6,6 @@ import Touchable from '../touchable'; import Color from '../../style/color'; import UserIcon from '../userIcon'; -import CustomedList from '../customedList'; export default class FollowUserList extends Component { @@ -15,33 +14,102 @@ export default class FollowUserList extends Component { super(props); this.dataSource = props.dataSource; - this.listType = props.listType; + this.listType = props.listType || 'undefined'; + + this.state = { + users: [], + hasMore: false, + + refreshing: false, + refreshFailed: false + }; + } + + componentDidMount() { + InteractionManager.runAfterInteractions(() => { + this.refresh(); + }); + } + + refresh(loadMore = false) { + if (this.state.refreshing) { + return; + } + + this.setState({hasMore: false, refreshing: true, refreshFailed: false}); + this.dataSource.refresh(loadMore) + .then(result => { + if(!result) { + throw { + message: 'refresh ' + this.listType + ' no result' + } + + } else { + console.log('refresh ' + this.listType + ' result:', result); + + this.setState({ + users: result.list ? result.list : [], + hasMore: result.more, + refreshFailed: false + }); + } + + }).catch(e => { + this.setState({ + users: [], + hasMore: false, + refreshFailed: true + }); + + }).done(() => { + this.setState({ + refreshing: false + }); + }); + } + + loadMore() { + if (this.state.refreshing) { + return; + } + + this.refresh(true); } render() { return ( - <View style={localStyle.container}> - <CustomedList listType={this.props.listType} style={localStyle.list} + <View style={localStyle.container}> + <FlatList style={localStyle.list} - dataSource={this.props.dataSource} + data={this.state.users} - renderItem={({item}) => { - return ( - <Touchable key={item.id} onPress={() => {}}> - <View style={localStyle.box}> - <UserIcon iconUrl={item.iconUrl}></UserIcon> - <Text style={localStyle.userName}>{item.name}</Text> - <Touchable onPress={() => {}}> - <Ionicons name="md-close" size={20} - style={localStyle.removeIcon} - color={Color.inactiveText} /> - </Touchable> - </View> - </Touchable> - ); - }} - /> - </View> + keyExtractor={(item, index) => { + return item.id ? item.id.toString() : index; + }} + + renderItem={({item}) => { + return ( + <Touchable key={item.id} onPress={() => {}}> + <View style={localStyle.box}> + <UserIcon iconUrl={item.iconUrl}></UserIcon> + <Text style={localStyle.userName}>{item.name}</Text> + <Touchable onPress={() => {}}> + <Ionicons name="md-close" size={20} + style={localStyle.removeIcon} + color={Color.inactiveText} /> + </Touchable> + </View> + </Touchable> + ); + }} + + refreshing={this.state.refreshing} + onRefresh={this.refresh.bind(this)} + + onEndReachedThreshold={5} + onEndReached={this.state.hasMore ? this.loadMore.bind(this) : null} + /> + </View> ); } }