javascript - bertindak balas isu penghalaan tentang penomboran berbilang halaman antd

Question

Menggunakan jadual antd untuk membangunkan halaman berbilang halaman yang ringkas disertakan dalam jadual Ini adalah kali pertama saya menggunakan react@15.5.4, react-router@3.0.5, antd@2.0.9 penghalaan, anda boleh menambah laluan nombor halaman ke penyemak imbas dengan mengklik pada nombor halaman untuk berbilang halaman, tetapi anda masih akan kembali ke halaman utama selepas menyegarkan semula, atau walaupun alamat penyemak imbas telah berubah, anda masih berada di halaman asal halaman nombor dan tidak ada lompat. Tolong bantu saya

1, Pengagihan laluan

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, pada halaman Kewangan, 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, komponen jadual dalam Kewangan

<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

Saya telah menyelesaikannya sendiri

    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

Di manakah setState anda yang mencetuskan kemas kini tindak balas?