ant-design / ant-design/pro-components

为什么ProTable的search里的submitterColSpanProps里的span属性一定要number类型?

Open
#8,643 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.8k
Forks
1.4k
Avg merge
10h 44m
Merged PRs (30d)
3

Description

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

### 🧐 问题描述

submitterColSpanProps的span设置为number类型后,当页面宽度比较小的时候并在submit区域添加多一个按钮后,submit区域就有可能超出页面

### 💻 示例代码
submit区域有可能超出页面
```
search={{
layout: "horizontal",
optionRender: (searchConfig, props, dom) => [
...dom,
,
,
],
labelWidth: "auto",
collapseRender: false,
collapsed: false,
submitterColSpanProps: { span: 8, flex: "auto" },
}}

```
submit区域可以正常换行
```
search={{
layout: "horizontal",
optionRender: (searchConfig, props, dom) => [
...dom,
,
,
],
labelWidth: "auto",
collapseRender: false,
collapsed: false,
submitterColSpanProps: { span: "auto" as unknown as number, flex: "auto" },
}}
```
### 🚑 其他信息
类型定义
![image](https://github.com/user-attachments/assets/e87d7d14-0098-421e-a53b-ae309fe9df5a)
span设置为number超出页面
![image](https://github.com/user-attachments/assets/2b527800-63a6-4409-97c4-4fc5643879eb)
span设置为auto正常显示
![image](https://github.com/user-attachments/assets/b9d6833e-b74a-4a25-a0f8-361136941070)

Contributor guide

Open the contributing guide

Research direction

Start at ProTable's search entry point and inspect the type definition for submitterColSpanProps, especially span. Reproduce the supplied narrow-screen example with an added optionRender button, comparing a numeric span with the demonstrated auto value. Done means the submit area can wrap responsively without requiring an unsafe type cast.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.