React 前台分页

/**

• Created by mashroom on 6/7/2018.
  */
  import React, { Component } from 'react';
  import { List, Avatar , Row, Col, Checkbox, Button,message,Pagination } from 'antd';
  import PageHeaderLayout from '../../layout/PageHeaderLayout';
  import styles from './index.less';
  import {global} from "../../constants/global";
  const {IME_EDITOR_URL} = global;
  class Search extends Component {
  state = {
  current: 1, //当前页码,
  pageSize:3 //每页显示条数
  }
  componentDidMount() {

  }
  onChangePage = (page) => {
  this.setState({
  current: page,
  });
  }

  render() {
  //ajax 获取的数据
  const data = [
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 1',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 2',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 3',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 4',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 3',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 5',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 6',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  {
  oid:"com.megalink.ime.model.part.Part:1",
  title: 'Ant Design Title 8',
  content:"Ant Design, a design language for background applications, is refined by Ant UED Team"
  },
  ];
  //
  return (
  
  

  
  
  
  

  
  itemLayout="horizontal"
  dataSource={data.slice((this.state.current-1)this.state.pageSize,(this.state.current-1)this.state.pageSize+this.state.pageSize)}
  renderItem={item => (
  
  avatar={}
  title={{item.title}}
  description={

  }
  />
  
  )}
  />
  {/分页目录/}
  

  
  defaultCurrent={1}
  current={this.state.current}
  total={data.length}
  defaultPageSize={this.state.pageSize}
  onChange={this.onChangePage}
  showTotal={(e)=>{return "共 "+e+" 条"}}
  />
  

) }

}

export default Search;