Skip to content

Commit 350b599

Browse files
Wxh16144RedJue
authored andcommitted
chore: Form.Item should not support requiredMark (ant-design#41725)
* test: add case * chore: Form.Item does not support requiredMark
1 parent 5f0a8b7 commit 350b599

File tree

4 files changed

+30
-2
lines changed

4 files changed

+30
-2
lines changed

components/form/FormItem/ItemHolder.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -186,8 +186,8 @@ export default function ItemHolder(props: ItemHolderProps) {
186186
{/* Label */}
187187
<FormItemLabel
188188
htmlFor={fieldId}
189-
requiredMark={requiredMark}
190189
{...props}
190+
requiredMark={requiredMark}
191191
required={required ?? isRequired}
192192
prefixCls={prefixCls}
193193
/>

components/form/FormItem/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ const MemoInput = React.memo(
5151
);
5252

5353
export interface FormItemProps<Values = any>
54-
extends FormItemLabelProps,
54+
extends Omit<FormItemLabelProps, 'requiredMark'>,
5555
FormItemInputProps,
5656
RcFieldProps<Values> {
5757
prefixCls?: string;

components/form/FormItemLabel.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,9 @@ export interface FormItemLabelProps {
3838
label?: React.ReactNode;
3939
labelAlign?: FormLabelAlign;
4040
labelCol?: ColProps;
41+
/**
42+
* @internal Used for pass `requiredMark` from `<Form />`
43+
*/
4144
requiredMark?: RequiredMark;
4245
tooltip?: LabelTooltipType;
4346
}

components/form/__tests__/index.test.tsx

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1797,4 +1797,29 @@ describe('Form', () => {
17971797
expect(onChange).toHaveBeenNthCalledWith(idx++, 'validating');
17981798
expect(onChange).toHaveBeenNthCalledWith(idx++, 'success');
17991799
});
1800+
1801+
// https://user-images.githubusercontent.com/32004925/230819163-464fe90d-422d-4a6d-9e35-44a25d4c64f1.png
1802+
it('should not render `requiredMark` when Form.Item has no required prop', () => {
1803+
// Escaping TypeScript error
1804+
const genProps = (value: any) => ({ ...value });
1805+
1806+
const { container } = render(
1807+
<Form name="basic" requiredMark="optional">
1808+
<Form.Item
1809+
label="First Name"
1810+
name="firstName"
1811+
required
1812+
{...genProps({ requiredMark: false })}
1813+
>
1814+
<Input />
1815+
</Form.Item>
1816+
<Form.Item label="Last Name" name="lastName" required {...genProps({ requiredMark: true })}>
1817+
<Input />
1818+
</Form.Item>
1819+
</Form>,
1820+
);
1821+
1822+
expect(container.querySelectorAll('.ant-form-item-required')).toHaveLength(2);
1823+
expect(container.querySelectorAll('.ant-form-item-required-mark-optional')).toHaveLength(2);
1824+
});
18001825
});

0 commit comments

Comments
 (0)