hover 导致重新计算虚拟 dom,加上 diff 时间是比较耗时,200 行数据考虑加上分页和过滤,20行的列表尝...
AntDesign 的 Table 组件本身就处理了 mouse 事件,hover 的蓝底都是操作 class 而不是 css。除此以...
这里的.ant-table-tbody > tr选择器表示选择表格中的行,hover伪类表示鼠标悬停时的状态,background-color属性设置背景颜色为#f5f5f5。 将样式应用到表格组件中,可以通过以下两种方式之一: 在组件的样式文件中直接引入表格样式: 代码语言:txt 复制 @import '~antd/dist/antd.css'; ...
会发现每一行的组件都会触发rerender输出"重渲染",即我移入某一行重渲染了当前表格页的所有row 相同代码antd 4.16.13无此问题 怀疑是rc-table 7.19版本更新引入的问题,本次更新引入了一个hoverContext,支持表格的hoverstyle,更新的代码链接react-component/table@2d0d403 ...
Table 表格 Less 变量Component Token备注 @table-bg colorBgContainer 全局Token @table-header-bg headerBg - @table-header-color headerColor - @table-header-sort-bg headerSortActiveBg - @table-body-sort-bg bodySortActiveBg - @table-row-hover-bg rowHoverBg - @table-selected-row-color colorText...
return <BaseTable dataSource={dataSource} columns={columns} /> } 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 虚拟滚动 当数据量较大时,表格会自动开启虚拟滚动。(在线示例) 通过dataSource 传入一个长度超过5万的数组,表格依旧流畅。当表格向下滚动时...
首先是碰到一个问题,就是当columns里的render依赖当前组件的状态时,TableRow就不是一个 Pure Component 了,没法用shouldComponentUpdate去优化(见:react-component/table#98)。 那有没有办法让render不依赖当前组件的状态来实现类似表格内编辑的功能呢,以@whx76贴的那个 edit-hover 的例子为基础,我把它改成了这样,...
优化 Table 中 rowScope 的样式。 为组件聚焦时的 outline 提供新的 AliasToken lineWidthFocus。 WeekPicker 支持鼠标悬浮样式。 调整 Select, TreeSelect, Cascader 在多选时总是默认显示下拉箭头。 修复 Form 组件 Form.Item.useStatus 导致的服务端渲染问题。 修复部分组件箭头形状问题。 修复 Layout 报错 React d...
🆕 Table.Summary.Row 组件增加 onClick 属性。#42175 @Ylg12345 🆕 Space 新增支持 ref。#42266 @RedJue 🆕 Tab 新增默认继承 Card 的 size。#42183 @huangkairan ConfigProvider 🐞 修复 ConfigProvider size 对Pagination 无效的问题。#42206 🐞 修复 ConfigProvider size 对Steps 无效的问题。#4...
}, { key: '2', name: 'Jane', age: 28, }, ]; return ( <Form form={form} component={false}> <Table components={{ body: { cell: EditableCell, }, }} dataSource={data} columns={columns} rowClassName="editable-row" pagination={false} /> </Form> ); }; export default MyTable...