update components DataTable

src/components/DataTable/DataTable.js

@@ -7,18 +7,19 @@ import './DataTable.less'
 class DataTable extends React.Component {
   constructor (props) {
     super(props)
-    const { dataSource, pagination = false } = props
+    const { dataSource, pagination = {
+      showSizeChanger: true,
+      showQuickJumper: true,
+      showTotal: total => `共 ${total} 条`,
+      current: 1,
+      total: 100 },
+    } = props
     this.state = {
       loading: false,
       dataSource,
       fetchData: {},
-      pagination: pagination === true ? {
-        showSizeChanger: true,
-        showQuickJumper: true,
-        showTotal: total => `共 ${total} 条`,
-        current: 1,
-        total: 100,
-      } : pagination }
+      pagination,
+    }
   }
 
   componentDidMount () {
@@ -28,10 +29,19 @@ class DataTable extends React.Component {
   }
 
   componentWillReceiveProps (nextProps) {
-    if (!lodash.isEqual(nextProps.fetch, this.props.fetch)) {
+    const staticNextProps = lodash.cloneDeep(nextProps)
+    delete staticNextProps.columns
+    const { columns, ...otherProps } = this.props
+
+    if (!lodash.isEqual(staticNextProps, otherProps)) {
       this.props = nextProps
       this.fetch()
     }
+
+    // if (!lodash.isEqual(nextProps.fetch, this.props.fetch)) {
+    //   this.props = nextProps
+    //   this.fetch()
+    // }
   }
 
   handleTableChange = (pagination, filters, sorter) => {
@@ -51,16 +61,16 @@ class DataTable extends React.Component {
   }
 
   fetch = () => {
-    const { fetch: { url, data, dataKey, ...otherFetch } } = this.props
+    const { fetch: { url, data, dataKey } } = this.props
     const { fetchData } = this.state
     this.setState({ loading: true })
+    console.log(data)
     request(url, {
       result: 10,
       data: {
         ...data,
         ...fetchData,
       },
-      ...otherFetch,
     }).then((result) => {
       const { pagination } = this.state
       pagination.total = result.total || pagination.total

src/routes/ui/dataTable.js

@@ -22,6 +22,7 @@ class DataTablePage extends React.Component {
     const staticDataTableProps = {
       dataSource: [{ key: '1', name: 'John Brown', age: 24, address: 'New York' }, { key: '2', name: 'Jim Green', age: 23, address: 'London' }],
       columns: [{ title: 'name', dataIndex: 'name' }, { title: 'Age', dataIndex: 'age' }, { title: 'Address', dataIndex: 'address' }],
+      pagination: false,
     }
 
     const fetchDataTableProps = {
@@ -39,7 +40,6 @@ class DataTablePage extends React.Component {
         { title: 'Gender', dataIndex: 'gender' },
       ],
       rowKey: 'registered',
-      pagination: true,
     }
 
     const caseChangeDataTableProps = {
@@ -58,7 +58,6 @@ class DataTablePage extends React.Component {
         { title: 'Gender', dataIndex: 'gender' },
       ],
       rowKey: 'registered',
-      pagination: true,
     }
 
     return (<div className="content-inner">

src/theme.js

@@ -9,6 +9,5 @@ module.exports = () => {
     '@menu-dark-bg': '#3e3e3e',
     '@text-color': '#666',
     '@font-family': '"AvenirNext-Regular", "Helvetica Neue", "lucida grande", "PingFangHK-Light", "STHeiti", "Heiti SC", "Hiragino Sans GB", "Microsoft JhengHei", "Microsoft Yahei", SimHei, "WenQuanYi Micro Hei", "Droid Sans", "Roboto", Helvetica, Tahoma, Arial, "sans-serif"',
-    // '@font-family': '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif',
   }
 }