Open amy-fang opened 1 month ago
同问,有follow的issue或者其他吗
Originally posted by @LiuZHolmes in https://github.com/ant-design/pro-components/issues/358#issuecomment-2044100850
column如果是静态设置的,defaultSortOrder能生效。如果需要根据根据条件显示不一样的column,对column进行setState,defaultSortOrder就无效了。
import React, { useState,useEffect } from 'react'; import { Table } from 'antd'; import type { TableColumnsType, TableProps } from 'antd'; interface DataType { key: React.Key; name: string; age: number; address: string; } const columns: TableColumnsType<DataType> = [ { title: 'Name', dataIndex: 'name', showSorterTooltip: { target: 'full-header' }, filters: [ { text: 'Joe', value: 'Joe', }, { text: 'Jim', value: 'Jim', }, { text: 'Submenu', value: 'Submenu', children: [ { text: 'Green', value: 'Green', }, { text: 'Black', value: 'Black', }, ], }, ], // specify the condition of filtering result // here is that finding the name started with `value` onFilter: (value, record) => record.name.indexOf(value as string) === 0, sorter: (a, b) => a.name.length - b.name.length, sortDirections: ['descend'], }, { title: 'Age', dataIndex: 'age', defaultSortOrder: 'descend', sorter: (a, b) => a.age - b.age, }, { title: 'Address', dataIndex: 'address', filters: [ { text: 'London', value: 'London', }, { text: 'New York', value: 'New York', }, ], onFilter: (value, record) => record.address.indexOf(value as string) === 0, }, ]; const data = [ { key: '1', name: 'John Brown', age: 32, address: 'New York No. 1 Lake Park', }, { key: '2', name: 'Jim Green', age: 42, address: 'London No. 1 Lake Park', }, { key: '3', name: 'Joe Black', age: 32, address: 'Sydney No. 1 Lake Park', }, { key: '4', name: 'Jim Red', age: 32, address: 'London No. 2 Lake Park', }, ]; const onChange: TableProps<DataType>['onChange'] = (pagination, filters, sorter, extra) => { console.log('params', pagination, filters, sorter, extra); }; const App: React.FC = () => { const [tableColumns, setTableColumns] = useState([]); useEffect(() => { setTableColumns(columns); }, []); return( <Table columns={tableColumns} dataSource={data} onChange={onChange} showSorterTooltip={{ target: 'sorter-icon' }} /> )}; export default App;
default只有第一次渲染会生效 你有兴趣把order搞成受控吗
column set state了第一次都没效果 没法直接sortOrder,因为有其他字段要sort
我这边甚至对defaultsortorder静态设置都没效果
Originally posted by @LiuZHolmes in https://github.com/ant-design/pro-components/issues/358#issuecomment-2044100850
column如果是静态设置的,defaultSortOrder能生效。如果需要根据根据条件显示不一样的column,对column进行setState,defaultSortOrder就无效了。