ant-design / ant-design/pro-components
👑 [需求] schemaform 中组件 group 中的gutter 属性是写死的,不能只定义
- 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
### 🔩 所属模块或组件
BetaSchemaForm -> group (packages/form/src/components/Group/index.tsx)
### 🥰 需求描述
```tsx
// packages/form/src/components/Group/index.tsx:98
const [childrenDoms, hiddenDoms] = useMemo(() => {
const hiddenChildren: React.ReactNode[] = [];
const childrenList = React.Children.toArray(children).map(
(element, index) => {
if (React.isValidElement(element) && element?.props?.hidden) {
hiddenChildren.push(element);
return null;
}
if (index === 0 && React.isValidElement(element) && autoFocus) {
return React.cloneElement(element, {
...(element.props as any),
autoFocus,
});
}
return element;
},
);
return [
{childrenList}
,
hiddenChildren.length > 0 ? (
{hiddenChildren}
) : null,
];
}, [children, RowWrapper, Wrapper, autoFocus]);
```
`` 这里没有提供自定义 props 传入,导致不能修改row相关属性
Contributor guide
Research direction
Start in packages/form/src/components/Group/index.tsx, especially the useMemo block around line 98 where RowWrapper is rendered. Trace how Group and RowWrapper receive row-related props, then make the requested customization possible for the group’s row attributes and gutter. Done means callers can define those properties instead of relying on the hard-coded behavior; verify the affected form group behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 52/100