ant-design / ant-design/pro-components
🐛[BUG]BetaSchemaForm组件 使用查询表单 当第一列数据设置colSize=4时,设置的defaultColsNumber不生效,永远默认就只展示了一行数据
- 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
### 🐛 bug 描述
BetaSchemaForm组件 使用查询表单 当第一列数据设置colSize=4时(只要是大于内置的每行的列数都有问题),设置的defaultColsNumber不生效,永远默认就只展示了一行数据
### 📷 复现步骤
import type {
ProFormColumnsType,
ProFormLayoutType,
} from "@ant-design/pro-components";
import { BetaSchemaForm, ProFormSelect } from "@ant-design/pro-components";
import { Alert, DatePicker, Space } from "antd";
import dayjs from "dayjs";
import { useState } from "react";
const columns = new Array(10).fill(1).map((_, index) => {
return {
id: (Date.now() + index).toString(),
title: `活动名称${index}`,
colSize: index === 0 ? 1 : 1,
};
});
const columns1 = new Array(10).fill(1).map((_, index) => {
return {
id: (Date.now() + index).toString(),
title: `活动名称${index}`,
colSize: index === 0 ? 4 : 1,
};
});
const columns2 = new Array(10).fill(1).map((_, index) => {
return {
id: (Date.now() + index).toString(),
title: `活动名称${index}`,
colSize: index === 1 ? 4 : 1,
};
});
export default () => {
return (
<>
!!! 第一行colSize=1 defaultColsNumber=10
layoutType={"QueryFilter"}
defaultColsNumber={10}
columns={columns}
autoFocusFirstInput={false}
/>
!!! 第一行colSize=4 defaultColsNumber=10 显示错误 只能默认展开一行
layoutType={"QueryFilter"}
defaultColsNumber={10}
columns={columns1}
autoFocusFirstInput={false}
/>
!!! 第二行colSize=4 defaultColsNumber=10 能正确显示
layoutType={"QueryFilter"}
defaultColsNumber={10}
columns={columns2}
autoFocusFirstInput={false}
/>
);
};
设置的三种方式 colSize只要第一列数据大于了设置的每行的列数 就只能显示默认展示一行 第二列数据设置colSize就是正确的
### 🏞 期望结果
当设置第一行为colSize>1时,设置的defaultColsNumber依然生效
有需求就是查询表单第一项需要整行展示,这个bug就无法实现这个需求
### 💻 复现代码
[defaultColsNumber](https://codesandbox.io/p/sandbox/fu-ceng-chuang-kou-forked-cl7pyy?file=%2FApp.tsx%3A51%2C9-51%2C26)
### © 版本信息
- @ant-design/pro-components@2.7.16
- umi 版本
- 浏览器环境
- 开发环境 [e.g. mac OS]
### 🚑 其他信息
Contributor guide
Research direction
Start with the BetaSchemaForm QueryFilter reproduction and compare the three column configurations in the provided CodeSandbox, especially when the first item has colSize=4. Trace how defaultColsNumber is applied and verify that the expected number of columns remains visible when the first item spans more than one column.
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