javascript - réagir aux problèmes de routage concernant la pagination multipage etd

Question

Utilisation du tableau d'antd pour développer une simple page multipage. La pagination multipage est incluse dans le tableau. C'est la première fois que j'utilise réagir@15.5.4, réagir-router@3.0.5, antd@2.0.9. routage, vous pouvez ajouter l'itinéraire du numéro de page au navigateur en cliquant sur le numéro de page pour plusieurs pages, mais vous reviendrez toujours à la page d'accueil après l'actualisation, ou même si l'adresse du navigateur a changé, vous êtes toujours sur le numéro de page d'origine page et il n'y a pas de saut S'il vous plaît, aidez-moi. Pouvez-vous m'aider Vous trouverez ci-dessous la partie code

.

1, Répartition des itinéraires

class Index extends React.Component {
    render () {
        return (
            <Router history={hashHistory}>
                <Route path="/" component={App}>
                    <IndexRoute component={Login}></IndexRoute>
                    <Route path="/finance/:page" component={Finance}></Route>
                </Route>
            </Router>
        );
    }
}

2, sur la page Finances, hashHistory.push()

    handleTableChange = (pagination, filters, sorter) => {
        this.fetch({
            results: pagination.pageSize,
            page: pagination.current,
            // sortField: sorter.field,
            // sortOrder: sorter.order,
            ...filters,
        });
        // console.log(pagination)
        hashHistory.push(`/finance/${pagination.current}`);
    }

3, composant table dans Finance

<Table
    rowSelection={rowSelection}
    columns={this.columns}
    rowKey={record => record.wid}
    dataSource={this.state.data}
    pagination={this.state.pagination}
    loading={this.state.loading}
    onChange={this.handleTableChange}
/>

Answer 1

Je l'ai résolu moi-même. J'ai rechargé le composantWillReceiveProps. À la fin, la page changera lorsque j'actualiserai ou que je reviendrai en arrière. Je ne sais pas si cette méthode est correcte

.

    componentWillReceiveProps(nextProps) {
        // console.log(nextProps);
        const { pagination, filters } = this.state;
        pagination.current = Number(nextProps.params.page);
        this.setState({
            pagination,
        });
        this.fetch({
            size: pagination.pageSize,
            page: pagination.current - 1,
            startDate: this.state.startDate,
            endDate: this.state.endDate,
            ...filters,
        });
    }

Answer 2

Où est votre setState qui déclenche la mise à jour de réaction ?