ant-design / pro-components

🏆 Use Ant Design like a Pro!
https://pro-components.antdigital.dev
MIT License
4.02k stars 1.28k forks source link

🧐[问题]ProTable toolbar没有small模式 #8252

Open chengmaoning opened 1 month ago

chengmaoning commented 1 month ago

🧐 问题描述

ProTable defaultSize="small",但是上面的toolbar仍然很高,看了下padding=16,怎么让toolbar变窄或者跟随small模式。

💻 示例代码

 <ProTable
        columns={columns}
        pagination={false}
        rowKey={'code'}
        bordered
        ghost
        search={false}
        options={false}
        tableAlertOptionRender={false}
        tableAlertRender={false}
        toolbar={{
          actions: [
            <Dropdown.Button
              key="batch_print"
              type="link"
              disabled={!selectedKeys?.length}
             menu ={{}}                 
              >
              打印
            </Dropdown.Button>,
          ],
        }}
        defaultSize="small"
        rowSelection={{
          selectedRowKeys: selectedKeys,
          onChange: setSelectedKeys,
        }}

🚑 其他信息

image

zhuba-Ahhh commented 3 weeks ago

可行

chengmaoning commented 3 weeks ago

可行

大佬有何建议?

zhuba-Ahhh commented 3 weeks ago

可行

大佬有何建议?

看了下和你的想法一样应该有两种解决方案,主要toolbar的padding是固定的

  1. defaultSize也传入toolbar,toolbar跟随defaultSize修改对应padding
  2. toolbar新增类似defaultSize控制padding 个人觉得1ok
ONLY-yours commented 3 weeks ago

看起来最后还是走的 antd token,官网用紧凑模式的 demo 倒是对的,感觉包一层 ConfigProvider 就好了