ant-design / ant-design/pro-components
使用 EditableProTable renderFormItem 下拉選單 Select 下添加任一標籤<span> form功能無法正常運作
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
### Reproduction link
### Steps to reproduce
```
{
title: '部門',
width: 150,
dataIndex: "department",
valueType: 'select',
formItemProps: {
rules: [
{
required: true,
message: '必須輸入',
},
],
},
renderFormItem: (dom, {type, defaultRender, ...rest}, form) => {
return (
<>
{/*123*/} //如果加入任一標籤form 功能失效
{
console.warn(val);
console.warn(val);
form.setFieldsValue({department: val})
// setMember(val)
}}
style={{width: '100%'}}
>
)
}
},
({
id: uuidv4(),
type: "1"
}),
}}
editable={{
type: 'multiple',
form: editForm,
editableKeys,
deleteText: "",
actionRender: (row, config, defaultDoms) => {
return (
)
},
onValuesChange: (record, recordList) => {
setDataSource(recordList);
},
onChange: setEditableRowKeys,
}}
/>
```
### What is expected?
表單會自動帶入資料,form.validateFields()檢驗正確
### What is actually happening?
renderFormItem Select 中加入任一標籤 ,form 功能無法正常使用
| Environment | Info |
| --- | --- |
| antd | 5.17.3 |
| React | 18.2.0 |
| System | System |
| Browser | google |
https://github.com/ant-design/ant-design/assets/36724474/cb4caa37-f14c-415d-8564-4324ae0dcedd
Contributor guide
Research direction
Start from the EditableProTable column's renderFormItem reproduction with Select and an added wrapper element. Compare form population and form.validateFields() behavior with and without the wrapper, using the provided antd 5.17.3 and React 18.2.0 setup. Done means the wrapped Select continues to receive form data and validation succeeds.
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
- 35/100