一般情况下，都是表格的分页需求。(获得页面的数据，需要的参数（itemname， mutant_gene ，nucleotide，pageNo，pageSize）)
// 在modal文件下
* eff_getSiteInformation ({ payload, }, { call, put, select }) {
const resp = yield call(getSiteInformation, payload)
if (isSucc(resp)) {
let SiteInformationList = resp.data.list
let pagination = {
current: resp.data.pageNum,
total: resp.data.total,
pageSize: payload.pageSize,
showTotal: (total) => `共${total}条记录`
}
let idx = (pagination.current - 1) * pagination.pageSize + 1
for (let item of SiteInformationList) {
item.index = idx
idx++
}
yield put({type: 'update', payload: {SiteInformationList, pagination}})
}
}
// 另一个组件中（兄弟组件）通过modal中的searchJson来实现组件中的值，变为全局可用 （另外一些参数在另一个兄弟组件中：itemname， mutant_gene ，nucleotide）
this.props.form.validateFields((err, values) => {
if (err) {
return
}
let json = {
itemname: values.itemId,
mutant_gene: values.mutable,
nucleotide: values.change,
pageSize: 10,
pageNo: 1
}
this.props.dispatch({type: 'siteConfig/searchJson', payload: json})
this.props.dispatch({type: 'siteConfig/eff_getSiteInformation', payload: json})
})
// 在model中的searchJson
reducers: {
searchJson (state, {payload}) {
return { ...state, searchJson: payload }
}
}
// 在view文件下
// 页码改变的回调函数，需要传参，这里因为一部分参数是另一个组件（兄弟组件）中的值，所以需要通过modal来进行值之间的通信
onPaginationChange = (searchObj) => {
let { pageNum, pageSize } = searchObj
let searchJson = this.props.siteConfig.searchJson
searchJson.pageNo = pageNum
searchJson.pageSize = pageSize
this.props.dispatch({type: 'siteConfig/searchJson', payload: searchJson})
this.props.dispatch({type: 'siteConfig/eff_getSiteInformation', payload: searchJson})
}
//分页的一些配置 （只知道一些参数：pageNo，pageSize）
const pagination = {
onChange: (pageNum, pageSize) => this.onPaginationChange({ pageNum, pageSize }), // 页码改变的回调，参数是改变后的页码及每页条数
onShowSizeChange: (pageNum, pageSize) => this.onPaginationChange({pageNum, pageSize}), // pageSize 变化的回调
...this.props.siteConfig.pagination,
showSizeChanger: true,
showQuickJumper: true,
}
<Table
pagination={pagination} //分页功能
dataSource={dataSource}
columns={this.getTableColumns}
rowSelection={rowSelection}
scroll = {{x: 1300}}
/>