pro-components icon indicating copy to clipboard operation
pro-components copied to clipboard

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

Open chengmaoning opened this issue 1 year ago • 5 comments

🧐 问题描述

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

chengmaoning avatar Mar 22 '24 05:03 chengmaoning

可行

zhuba-Ahhh avatar Apr 04 '24 17:04 zhuba-Ahhh

可行

大佬有何建议?

chengmaoning avatar Apr 07 '24 04:04 chengmaoning

可行

大佬有何建议?

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

  1. defaultSize也传入toolbar,toolbar跟随defaultSize修改对应padding
  2. toolbar新增类似defaultSize控制padding 个人觉得1ok

zhuba-Ahhh avatar Apr 07 '24 05:04 zhuba-Ahhh

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

ONLY-yours avatar Apr 07 '24 09:04 ONLY-yours

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

有计划增加这个功能到下一个版本发布不?

chengmaoning avatar May 09 '24 16:05 chengmaoning