0

前後の機能を備えたページネーションを実装しようとしていますが、問題は遷移間の状態を維持し、ナビゲーションで復元する方法ですか?

次の方法でreact-routerでそれを達成しようとしていました:

検索結果コンポーネント

handleNextPage(){
        this.props.push({
            pathname: '/search_result',
            query:{
                key:key,
                location:location,
                page: eventKey
            },
            state:{
                content:this.props.searchResult.content,
                number: eventKey
            }
        });
    }

次に、リデューサーで:

import {LOCATION_CHANGE} from 'react-router-redux';
export default function (state = INIT_STATE, action) {
switch (action.type) {
    case LOCATION_CHANGE:
        let {pathname} = action.payload;
        if (pathname === PATHNAME && (action.payload.state !== null)) { 
                return {...state, content: action.payload.state.content, number: action.payload.state.number}
        }
}

return state;

}

問題は、SearchResult コンポーネントが開始されたときに、サーバーからのデータがまだ利用できないため、空の配列が現在の場所の状態として保存されることです。

それを解決する方法についてのアイデアを事前にありがとう。

4

1 に答える 1