nz-table implement defaut automatic sort and filter
See original GitHub issueWhat problem does this feature solve?
most sort and filter function are almost the same ,
What does the proposed API look like?
<th nzShowSort nzSortKey="name" /> will use the default sort function
the defaut sort implement will be something like this
sort(e: { key: string, value: "ascend" | "descend" | null }) {
if (e.value != null) {
this.dataOriginal= this.data.filter(x => true); // copy the data
this.data= this.dataOriginal.filter(x => true).sort((a, b) => e.value === "ascend" ? a[e.key] > b[e.key] ? 1 : -1 : a[e.key] < b[e.key]? 1:-1)
}
else {
this.data= this.dataOriginal;
}
}
the same logic can be applied to the filter : [nzFilters] can be extract from the data property, compare function using js operator ==
Issue Analytics
- State:
- Created 4 years ago
- Comments:8 (4 by maintainers)
Top Results From Across the Web
nz-table set sorting/filtering programmatically #5304 - GitHub
To set a default sort order we'd have to add a new public property to the component (for each relevant column) and use...
Read more >How can I set default sorter and filters on antd table ...
For default sort use defaultSortOrder . It can take ascend and descend as values. Share.
Read more >Table | NG-ZORRO - Ant Design
A table displays rows of data. When To Use#. To display a collection of structured data. To sort, search, paginate and filter data....
Read more >Sort data in a table - Microsoft Support
Sort the table. Select a cell within the data. Select Home > Sort & Filter. Sort&Filter. Or, select Data > Sort. DATA-Sort&Filter. Select...
Read more >Table IMPORT MODULE - Ng Alain
st is not creating another table component, but use configurable rendering table on base of nz-table . this method can satisfy most scenes...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

@John0King 用户自己排序只需要一行代码,增加API需要给每个事件都区分是前端处理还是后端处理,何况排序和筛选不同的用户有完全不同的需求,组件根本不会知道排序和筛选的key是什么,还需要增加筛选函数的输入。 这个函数,用户自己传进去和在事件发生的时候自己调用一下没有任何区别,组件帮用户处理排序等事件除了增加复杂度基本没有带来任何好处。
@vthinkxie 但是
tableInstance.data相较于 [nzData] 已经是复制的数据,并且被截取了一部分处理。 我的意思是:或者添加一个属性,明确 是否让table组件自己去处理
这样,当用户自己订阅事件的时候, 可以跟自己的
[nzData]去交互, table组件不再替用户去处理, 当用户自己不去处理的时候, sort 和 filter 交给table组件去处理, 而模板上还是跟以前一样,用tableInstance.data就好了