diff --git a/src/component/diary/diaryBrief.js b/src/component/diary/diaryBrief.js
index 87da2dc..cd918c8 100644
--- a/src/component/diary/diaryBrief.js
+++ b/src/component/diary/diaryBrief.js
@@ -18,7 +18,7 @@ export default class DiaryBrief extends Component {
let editable = this.props.editable;
return (
-
+
{(user && user.iconUrl)
? : null}
diff --git a/src/component/diary/diaryList.js b/src/component/diary/diaryList.js
index 3e063d6..6d62dc1 100644
--- a/src/component/diary/diaryList.js
+++ b/src/component/diary/diaryList.js
@@ -14,6 +14,7 @@ import Msg from '../../util/msg';
import Api from '../../util/api';
import Touchable from '../touchable';
+import ListFooter from '../listFooter';
import DiaryBrief from './diaryBrief';
@@ -24,13 +25,14 @@ export default class DiaryList extends Component {
this.dataSource = props.dataSource;
this.state = {
- isLoading: true,
-
diaries: [],
- hasMore: false,
-
+
refreshing: false,
- refreshFailed: false
+ refreshFailed: false,
+
+ hasMore: true,
+ loadingMore: false,
+ loadFailed: false
};
}
@@ -40,23 +42,23 @@ export default class DiaryList extends Component {
});
}
- async refresh(loadMore = false) {
+ async refresh() {
if (this.state.refreshing) {
return;
}
- this.setState({hasMore: false, refreshing: true, refreshFailed: false});
- this.dataSource.refresh(loadMore)
+ this.setState({refreshing: true, refreshFailed: false});
+ this.dataSource.refresh()
.then(result => {
if(!result) {
throw {
- message: 'refresh no result'
+ message: 'refresh diary no result'
}
} else {
let diaries = this.state.diaries;
let newDiaries = result.list;
- if (!loadMore && diaries.length > 0 && newDiaries.length > 0
+ if (diaries.length > 0 && newDiaries.length > 0
&& diaries[0].id === newDiaries[0].id) {
Msg.showMsg('没有新内容');
@@ -64,40 +66,54 @@ export default class DiaryList extends Component {
this.setState({
diaries: result.list ? result.list : [],
- hasMore: result.more,
refreshFailed: false
});
}
}).catch(e => {
- if (e.code === 401) {
- /*
- this.props.navigator.showModal({
- screen: "App"
- });
- */
- }
-
this.setState({
- diaries: [],
- hasMore: false,
refreshFailed: true
});
}).done(() => {
this.setState({
- isLoading: false,
refreshing: false
});
});
}
async loadMore() {
- if (this.state.refreshing) {
+ if (this.state.loadingMore) {
return;
}
- this.refresh(true);
+ this.setState({loadingMore: true, loadFailed: false});
+ this.dataSource.refresh(true)
+ .then(result => {
+ if(!result) {
+ throw {
+ message: 'loadMore diary no result'
+ }
+
+ } else {
+ this.setState({
+ diaries: result.list ? result.list : [],
+ hasMore: result.more,
+ loadFailed: false
+ });
+ }
+
+ }).catch(e => {
+ this.setState({
+ hasMore: false,
+ loadFailed: true
+ });
+
+ }).done(() => {
+ this.setState({
+ loadingMore: false
+ });
+ });
}
render() {
@@ -111,8 +127,6 @@ export default class DiaryList extends Component {
return item.id.toString()
}}
- ListHeaderComponent={this.state.isLoading ? null : this.props.header}
-
renderItem={({item}) => {
return (
this.props.onDiaryPress(item)}>
@@ -123,12 +137,25 @@ export default class DiaryList extends Component {
ItemSeparatorComponent={({highlighted}) => }
- ListFooterComponent={this.renderFooter()}
+ ListFooterComponent={() => {
+ if (this.state.refreshing || this.state.loadingMore || this.state.diaries.length == 0) {
+ return null;
+ }
+
+ if (this.state.loadFailed) {
+ return ListFooter.renderFooterFailed(this.loadMore.bind(this));
+ }
+
+ if (!this.state.hasMore) {
+ return ListFooter.renderFooterEnd();
+ }
+
+ return ListFooter.renderFooterLoading();
+ }}
refreshing={this.state.refreshing}
onRefresh={this.refresh.bind(this)}
- automaticallyAdjustContentInsets={true}
onEndReachedThreshold={2}
onEndReached={this.state.hasMore ? this.loadMore.bind(this) : null}
>
@@ -136,38 +163,6 @@ export default class DiaryList extends Component {
);
}
-
- renderFooter() {
- if (this.state.refreshing || this.state.diaries.length === 0) {
- return null;
- }
-
- if (this.state.refreshFailed) {
- return (
-
- {this.loadMore();}}>
- 加载失败,请点击重试
-
-
- );
- }
-
- if (!this.state.hasMore) {
- return (
-
- —— THE END ——
-
- );
- }
-
- return (
-
-
-
- );
- }
}
const localStyle = StyleSheet.create({
@@ -176,11 +171,5 @@ const localStyle = StyleSheet.create({
},
list: {
height: '100%'
- },
- footer: {
- height: 60,
- justifyContent: 'center',
- alignItems: 'center',
- paddingBottom: 15
}
});
\ No newline at end of file
diff --git a/src/component/follow/followUserList.js b/src/component/follow/followUserList.js
index bc3ffe7..718f387 100644
--- a/src/component/follow/followUserList.js
+++ b/src/component/follow/followUserList.js
@@ -6,6 +6,7 @@ import Touchable from '../touchable';
import Color from '../../style/color';
import UserIcon from '../userIcon';
+import ListFooter from '../listFooter';
export default class FollowUserList extends Component {
@@ -18,10 +19,13 @@ export default class FollowUserList extends Component {
this.state = {
users: [],
- hasMore: false,
refreshing: false,
- refreshFailed: false
+ refreshFailed: false,
+
+ hasMore: true,
+ loadingMore: false,
+ loadFailed: false
};
}
@@ -31,13 +35,47 @@ export default class FollowUserList extends Component {
});
}
- refresh(loadMore = false) {
+ refresh() {
if (this.state.refreshing) {
return;
}
- this.setState({hasMore: false, refreshing: true, refreshFailed: false});
- this.dataSource.refresh(loadMore)
+ this.setState({refreshing: true, refreshFailed: false});
+ this.dataSource.refresh()
+ .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 : [],
+ refreshFailed: false
+ });
+ }
+
+ }).catch(e => {
+ this.setState({
+ refreshFailed: true
+ });
+
+ }).done(() => {
+ this.setState({
+ refreshing: false
+ });
+ });
+ }
+
+ loadMore() {
+ if (this.state.loadingMore) {
+ return;
+ }
+
+ this.setState({loadingMore: true, loadFailed: false});
+ this.dataSource.refresh(true)
.then(result => {
if(!result) {
throw {
@@ -50,32 +88,23 @@ export default class FollowUserList extends Component {
this.setState({
users: result.list ? result.list : [],
hasMore: result.more,
- refreshFailed: false
+ loadFailed: false
});
}
}).catch(e => {
this.setState({
- users: [],
hasMore: false,
- refreshFailed: true
+ loadFailed: true
});
}).done(() => {
this.setState({
- refreshing: false
+ loadingMore: false
});
});
}
- loadMore() {
- if (this.state.refreshing) {
- return;
- }
-
- this.refresh(true);
- }
-
render() {
return (
@@ -103,10 +132,26 @@ export default class FollowUserList extends Component {
);
}}
+ ListFooterComponent={() => {
+ if (this.state.refreshing || this.state.loadingMore || this.state.users.length == 0) {
+ return null;
+ }
+
+ if (this.state.loadFailed) {
+ return ListFooter.renderFooterFailed(this.loadMore.bind(this));
+ }
+
+ if (!this.state.hasMore) {
+ return ListFooter.renderFooterEnd();
+ }
+
+ return ListFooter.renderFooterLoading();
+ }}
+
refreshing={this.state.refreshing}
onRefresh={this.refresh.bind(this)}
- onEndReachedThreshold={5}
+ onEndReachedThreshold={2}
onEndReached={this.state.hasMore ? this.loadMore.bind(this) : null}
/>
diff --git a/src/component/listFooter.js b/src/component/listFooter.js
new file mode 100644
index 0000000..ff47ce9
--- /dev/null
+++ b/src/component/listFooter.js
@@ -0,0 +1,68 @@
+import React, {Component} from 'react';
+import {
+ ActivityIndicator,
+ TouchableOpacity,
+ StyleSheet,
+ Text,
+ View
+} from 'react-native';
+
+import Color from '../style/color';
+import Api from '../util/api';
+
+
+const localStyle = StyleSheet.create({
+ footer: {
+ height: 60,
+ justifyContent: 'center',
+ alignItems: 'center',
+ paddingBottom: 15
+ }
+});
+
+function renderFooterLoading() {
+ return (
+
+
+
+ );
+}
+
+function renderFooterEnd() {
+ return (
+
+
+ —— THE END ——
+
+
+ );
+}
+
+function renderFooterFailed(refresh) {
+ let isRefreshable = refresh && typeof refresh == 'function';
+
+ return (
+
+ {
+ if(isRefreshable) {
+ refresh();
+ }
+ }}
+ >
+
+ 加载失败{isRefreshable ? ',请点击重试' : ''}
+
+
+
+ );
+}
+
+
+export default {
+ renderFooterLoading,
+ renderFooterEnd,
+ renderFooterFailed
+}
+
diff --git a/src/component/notebook/notebookDiaryList.js b/src/component/notebook/notebookDiaryList.js
index 3967edf..1b934e0 100644
--- a/src/component/notebook/notebookDiaryList.js
+++ b/src/component/notebook/notebookDiaryList.js
@@ -15,6 +15,7 @@ import Color from '../../style/color';
import Touchable from '../touchable';
import DiaryBrief from '../diary/diaryBrief';
+import ListFooter from '../listFooter';
import NotebookDiaryData from '../../dataLoader/notebookDiaryData';
@@ -28,10 +29,13 @@ export default class NotebookDiaryList extends Component {
this.state = {
diaries: [],
- hasMore: false,
refreshing: false,
- refreshFailed: false
+ refreshFailed: false,
+
+ hasMore: true,
+ loadingMore: false,
+ loadFailed: false
};
}
@@ -76,30 +80,29 @@ export default class NotebookDiaryList extends Component {
return result;
}
- refresh(loadMore = false) {
- this.setState({refreshing: true});
- this.dataSource.refresh(this.notebook.id, loadMore)
- .then(result => {
- console.log('get notebook diaries:', result);
+ refresh() {
+ if (this.state.refreshing) {
+ return;
+ }
+ this.setState({refreshing: true, refreshFailed: false});
+ this.dataSource.refresh(this.notebook.id)
+ .then(result => {
if(!result) {
throw {
- message: 'refresh no result'
+ message: 'refresh notebookDiary no result'
}
} else {
let diaries = this.formatDiaries(result.list);
this.setState({
diaries,
- hasMore: result.more,
refreshFailed: false
});
}
}).catch(e => {
this.setState({
- diaries: [],
- hasMore: false,
refreshFailed: true
});
@@ -111,11 +114,38 @@ export default class NotebookDiaryList extends Component {
}
loadMore() {
- if (this.state.refreshing) {
+ if (this.state.loadingMore) {
return;
}
- this.refresh(true);
+ this.setState({loadingMore: true, loadFailed: false});
+ this.dataSource.refresh(this.notebook.id, true)
+ .then(result => {
+ if(!result) {
+ throw {
+ message: 'loadMore notebookDiary no result'
+ }
+
+ } else {
+ let diaries = this.formatDiaries(result.list);
+ this.setState({
+ diaries,
+ hasMore: result.more,
+ loadFailed: false
+ });
+ }
+
+ }).catch(e => {
+ this.setState({
+ hasMore: false,
+ loadFailed: true
+ });
+
+ }).done(() => {
+ this.setState({
+ loadingMore: false
+ });
+ });
}
render() {
@@ -132,60 +162,41 @@ export default class NotebookDiaryList extends Component {
);
}}
-
+
renderSectionHeader={(info) => {
return (
{info.section.title}
);
}}
- ListFooterComponent={this.renderFooter.bind(this)}
+ ListFooterComponent={() => {
+ if (this.state.refreshing || this.state.loadingMore || this.state.diaries.length == 0) {
+ return null;
+ }
- automaticallyAdjustContentInsets={true}
+ if (this.state.loadFailed) {
+ return ListFooter.renderFooterFailed(this.loadMore.bind(this));
+ }
+
+ if (!this.state.hasMore) {
+ return ListFooter.renderFooterEnd();
+ }
+
+ return ListFooter.renderFooterLoading();
+ }}
ItemSeparatorComponent={(sectionID, rowID, adjacentRowHighlighted) =>
}
SectionSeparatorComponent={() => }
+ onEndReachedThreshold={2}
onEndReached={this.state.hasMore ? this.loadMore.bind(this) : null}
/>
) : null;
}
-
- renderFooter() {
- if (this.state.refreshing || this.state.diaries.length === 0) {
- return null;
- }
-
- if (this.state.refreshFailed) {
- return (
-
- {this.loadMore();}}>
- 加载失败,请点击重试
-
-
- );
- }
-
- if (!this.state.hasMore) {
- return (
-
- —— THE END ——
-
- );
- }
-
- return (
-
-
-
- );
- }
}
const localStyle = StyleSheet.create({
@@ -206,11 +217,5 @@ const localStyle = StyleSheet.create({
sectionSeparator: {
borderBottomWidth: StyleSheet.hairlineWidth,
borderColor: Color.line
- },
- footer: {
- height: 60,
- justifyContent: 'center',
- alignItems: 'center',
- paddingBottom: 15
}
});
\ No newline at end of file
diff --git a/src/page/HomePage.js b/src/page/HomePage.js
index edca37a..8af3f2d 100644
--- a/src/page/HomePage.js
+++ b/src/page/HomePage.js
@@ -55,11 +55,11 @@ export default class HomePage extends Component {
const localStyle = StyleSheet.create({
wrap: {
flex: 1,
- backgroundColor: '#fff',
- paddingTop: 20
+ backgroundColor: '#fff'
},
header: {
paddingLeft: 20,
+ paddingTop: 20,
flexDirection: "row"
},
title: {
diff --git a/src/page/NotebookDetailPage.js b/src/page/NotebookDetailPage.js
index e7d25f8..b7fe534 100644
--- a/src/page/NotebookDetailPage.js
+++ b/src/page/NotebookDetailPage.js
@@ -9,9 +9,9 @@ export default class NotebookDetailPage extends Component {
render() {
return (
-
+
-
+
);
}
}