diff --git a/src/models/list.js b/src/models/list.js index 96742257a6964f6cb243340438cafcd657156e14..85bc6c97b30360a88f9246e9fae8390b9553736d 100644 --- a/src/models/list.js +++ b/src/models/list.js @@ -5,35 +5,33 @@ export default { state: { list: [], - loading: true, + loading: false, + cursor: 0, }, effects: { - *fetch({ payload, callback }, { call, put }) { + *fetch({ payload }, { call, put }) { yield put({ type: 'changeLoading', payload: true, }); const response = yield call(queryFakeList, payload); yield put({ - type: 'save', + type: 'appendList', payload: Array.isArray(response) ? response : [], }); yield put({ type: 'changeLoading', payload: false, }); - if (callback) { - callback(); - } }, }, reducers: { - save(state, action) { + appendList(state, action) { return { ...state, - list: action.payload, + list: state.list.concat(action.payload), }; }, changeLoading(state, action) { @@ -42,5 +40,11 @@ export default { loading: action.payload, }; }, + updateCursor(state, action) { + return { + ...state, + loading: action.payload, + }; + }, }, }; diff --git a/src/routes/List/SearchList.js b/src/routes/List/SearchList.js index 9c94fbc331ab6aa40d09eb68af84d154b8962e55..0bf3f83e7f8e98ef85690c30ed613d9a7b604265 100644 --- a/src/routes/List/SearchList.js +++ b/src/routes/List/SearchList.js @@ -12,25 +12,15 @@ import styles from './SearchList.less'; const { Option } = Select; const FormItem = Form.Item; +const pageSize = 5; + @Form.create() @connect(state => ({ list: state.list, })) export default class SearchList extends Component { - state = { - count: 3, - showLoadMore: true, - loadingMore: false, - } - componentDidMount() { - const { count } = this.state; - this.props.dispatch({ - type: 'list/fetch', - payload: { - count, - }, - }); + this.fetchMore(); } setOwner = () => { @@ -40,30 +30,11 @@ export default class SearchList extends Component { }); } - handleLoadMore = () => { - const { count } = this.state; - const nextCount = count + 5; - - this.setState({ - count: nextCount, - loadingMore: true, - }); + fetchMore = () => { this.props.dispatch({ type: 'list/fetch', payload: { - count: nextCount, - }, - callback: () => { - this.setState({ - loadingMore: false, - }); - - // fack count - if (nextCount < 10) { - this.setState({ - showLoadMore: false, - }); - } + count: pageSize, }, }); } @@ -86,7 +57,6 @@ export default class SearchList extends Component { } render() { - const { showLoadMore, loadingMore } = this.state; const { form, list: { list, loading } } = this.props; const { getFieldDecorator } = form; @@ -165,11 +135,10 @@ export default class SearchList extends Component { }, }; - const loadMore = showLoadMore ? ( + const loadMore = list.length > 0 ? (