mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 20:49:53 +08:00
1 line
12 KiB
JavaScript
1 line
12 KiB
JavaScript
|
(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["5a5209b1"],{"5a5209b1":function(e,a,t){"use strict";t.d(a,"__esModule",{value:!0}),t.d(a,"texts",{enumerable:!0,get:function(){return n;}}),t("bdb6feba");let n=[{value:"In v4, we added a custom ",paraId:0,tocIndex:0},{value:"components",paraId:0,tocIndex:0},{value:" example for Table, which replaces the default ",paraId:0,tocIndex:0},{value:"<tbody>",paraId:0,tocIndex:0},{value:" with ",paraId:0,tocIndex:0},{value:"components.body",paraId:0,tocIndex:0},{value:" to achieve virtual scrolling. But many developers feedback that the virtual table in the Demo has many functions that cannot be implemented. For example, fixed columns, merged rows and columns, expandable rows, etc.",paraId:0,tocIndex:0},{value:"So we proposed ",paraId:1,tocIndex:0},{value:"[RFC] StaticTable for fast perf & virtual scroll support",paraId:1,tocIndex:0},{value:" in v5. The RFC expects to provide a high-performance Table.StaticTable, which will support virtual scrolling by default. But as the development progressed, we eventually decided to implement StaticTable on the underlying ",paraId:1,tocIndex:0},{value:"rc-table",paraId:1,tocIndex:0},{value:", and on the antd side, we only need to enable it with ",paraId:1,tocIndex:0},{value:"<Table virtual />",paraId:1,tocIndex:0},{value:".",paraId:1,tocIndex:0},{value:"Table supports virtual scrolling by setting the ",paraId:2,tocIndex:1},{value:"virtual",paraId:2,tocIndex:1},{value:" prop. At the same time, the original Table's functions can be used normally:",paraId:2,tocIndex:1},{value:"<Table virtual scroll={{ x: 2000, y: 500 }} {...otherProps} />\n",paraId:3,tocIndex:1},{value:"You can visit the ",paraId:4,tocIndex:4},{value:"virtual list",paraId:5,tocIndex:4},{value:" example to experience it.",paraId:4,tocIndex:4},{value:"Table in antd internally uses the ",paraId:6,tocIndex:5},{value:"rc-table",paraId:6,tocIndex:5},{value:" component. Our virtual scrolling feature also reuses the ",paraId:6,tocIndex:5},{value:"components",paraId:6,tocIndex:5},{value:" property mentioned above. Replace the middle ",paraId:6,tocIndex:5},{value:"<tbody>",paraId:6,tocIndex:5},{value:" with ",paraId:6,tocIndex:5},{value:"rc-virtual-list",paraId:6,tocIndex:5},{value:", which is widely used in various virtual scrolling scenarios of antd like Select and Tree. ",paraId:6,tocIndex:5},{value:"rc-virtual-list",paraId:6,tocIndex:5},{value:" itself does not support horizontal scrolling, so we also added horizontal scrolling support for it in this refactoring.",paraId:6,tocIndex:5},{value:"In v4, we refactored the fixed columns of Table into ",paraId:7,tocIndex:6},{value:"position: sticky",paraId:7,tocIndex:6},{value:". This CSS allows you to fix an element at a certain position when scrolling. So as to avoid the need to render an extra Table in v3 to achieve the fixed position effect:",paraId:7,tocIndex:6},{value:"For overlapping fixed columns, you only need to configure different offsets:",paraId:8,tocIndex:6},{value:"We can also use this feature in virtual scrolling. Just reuse the ",paraId:9,tocIndex:6},{value:"sticky",paraId:9,tocIndex:6},{value:" style to achieve the effect of fixed columns. ",paraId:9,tocIndex:6},{value:"rc-virtual-list",paraId:9,tocIndex:6},{value:" only needs to provide horizontal scrolling, and does not need to care about the implementation of fixed columns.",paraId:9,tocIndex:6},{value:"We will flatten the tree structure of ",paraId:10,tocIndex:7},{value:"dataSource",paraId:10,tocIndex:7},{value:" through ",paraId:10,tocIndex:7},{value:"useFlattenRecords",paraId:10,tocIndex:7},{value:" in ",paraId:10,tocIndex:7},{value:"rc-table",paraId:10,tocIndex:7},{value:", so as to support developers' custom virtual scrolling capabilities. Thanks to ",paraId:10,tocIndex:7},{value:"@crawler-django",paraId:10,tocIndex:7},{value:" for his contribution at that time, so we don't need to implement the flattening logic again.",paraId:10,tocIndex:7},{value:"But in testing, we found a
|