在使用 Pagination 分頁的頁面內，添加一下代碼惯疙。實際情況酌情處理带猴。
1.引入相應的資源
import React from 'react';
import styles from '../index.css';
import { Pagination } from 'antd';
class ComDyn extends React.Component {
// 分頁
constructor(props) {
super(props);
this.state = {
agriculturalList: [],
currentData: [],
total: 20,
pageSize: 10,
pageNumber: parseInt(window.location.hash.slice(1), 0) || 1, //獲取當前頁面的hash值姑丑，轉換為number類型
};
// 在react中點擊事件里面 setState 時會使this重新定義，所以在點擊的函數(shù)里面使用this.setState()時會報錯this.setState not a function呀忧，因此需要提前給點擊事件的函數(shù)綁定this
this.onPageChange = this.onPageChange.bind(this);
//this.createMarkup = this.createMarkup.bind(this);
}
loadData(payload = {}) {
this.props.dispatch({
type: 'news/getNewsList',
payload,
});
}
componentDidMount() {
this.loadData();
}
onPageChange(page, pageSize) {
this.loadData({ pageNumber: page, pageSize });
}
render() {
//分頁
const agriculturalListData = this.state.currentData;
return (
{/*分頁*/}
<div className={styles.PaginationStyle}>
<Pagination
showQuickJumper
hideOnSinglePage={false}
defaultCurrent={this.state.pageNumber}
current={this.state.pageNumber}
total={this.state.total}
pageSize={this.state.pageSize}
onChange={this.onPageChange}
showTotal={e => {
return 'Total' + e + 'items';
}}
/>
</div>
</div>
);
}
}
export default ComDyn;
