老师您好,我想用ant-design里的远程加载数据table,可是一直报错,试了很久还是不知道怎么解决。。。

来源:9-6 AntDesign样式框架使用

Power_Deng

2017-03-28

export default class PCContainMainTable extends React.Component {
  constructor(){
    super();
    this.state = {
      data: [],
      pagination: {},
      loading: false,
    };
  }
  
  handleTableChange(pagination, filters, sorter){
    const pager = { ...this.state.pagination };
    pager.current = pagination.current;
    this.setState({
      pagination: pager,
    });
    this.fetch({
      results: pagination.pageSize,
      page: pagination.current,
      sortField: sorter.field,
      sortOrder: sorter.order,
      ...filters,
    });
  }
  fetch = (params = {}) => {
    console.log('params:', params);
    this.setState({ loading: true });
    reqwest({
      url: 'https://randomuser.me/api',
      method: 'get',
      data: {
        results: 10,
        ...params,
      },
      type: 'json',
    }).then((data) => {
      const pagination = { ...this.state.pagination };
      // Read total count from server
      // pagination.total = data.totalCount;
      pagination.total = 200;
      this.setState({
        loading: false,
        data: data.results,
        pagination,
      });
    });
  }
  componentDidMount() {
    this.fetch();
  }
  render() {
    return (
      <Table columns={columns}
        rowKey={record => record.registered}
        dataSource={this.state.data}
        pagination={this.state.pagination}
        loading={this.state.loading}
        onChange={this.handleTableChange}
      />
    );
  }
}

http://szimg.mukewang.com/58da0c1e0001963006770442.jpg

这个该如何解决呢,

写回答

2回答

Parry

2017-03-28

这个场景为什么要使用 ... 展开符号?

0
2
Power_Deng
非常感谢!
2017-03-29
共2条回复

Power_Deng

提问者

2017-03-28

//szimg.mukewang.com/58da323c00013f4b15360655.jpg

//szimg.mukewang.com/58da323c0001a14014330295.jpg

这是分页不能用的错误


0
2
Power_Deng
回复
Parry
谢谢老师,果然是this指向问题,解决啦~~~哈哈
2017-03-29
共2条回复

结合基础与实战学习React.js 独立开发新闻头条平台

轻松入门 React 开发,React Router 4 与 Webpack 2 完美升级项目

2768 学习 · 2126 问题

查看课程