table icon indicating copy to clipboard operation
table copied to clipboard

expand row very slow with 40 rows data. 大数据量,使用expandedRowKeys,展开/渲染变卡

Open NexxLuo opened this issue 7 years ago • 3 comments

当数据量较大时,同时使用expandedRowKeys控制展开,将会导致点击展开按钮时,展开动作很卡; 同时使用setState触发render的时候也会变卡。

比如:第一级数据 40条,第二级 10条 第三级 10条。 示例:https://codesandbox.io/s/m2j8o3m6p

NexxLuo avatar Aug 31 '18 09:08 NexxLuo

Just checking if this is going to be fixed any time soon. When the table has large data it becomes very unresponsive. Thanks

fgiarritiello avatar Jan 30 '19 22:01 fgiarritiello

他们的问题是所有的行不论是否展开,全都渲染。这个库应该重新写一下了。其实应该用一个简单的 table compoment 来完成 view 的工作,包括一些简单的layout 功能,然后这些展开的工作用一个外面包裹的控件来完成。

geyang avatar Mar 16 '19 05:03 geyang

  1. I solved this using memo and components prop:
<Table
    components={{
      body: {
        row: memo(
          (props) => {
            return <tr {...props} />;
          },
          (prevProps, nextProps) => {
            return prevProps.className === nextProps.className;
          }
        ),
      },
    }}
  />
  1. Or you can use VirtualTable

vladpuz avatar Dec 27 '23 09:12 vladpuz