ant-design / ant-design/pro-components
🐛[BUG] ProFormList 使用自定义ref FormListActionType 没办法触发 onAfterAdd onAfterRemove beforeRemoveRow
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
### 🐛 bug 描述
如同标题,使用自定义的ref没办法触发onAfterAdd和onAfterRemove, 和 beforeRemoveRow
### 📷 复现步骤
```
const llmListRef = useRef>();
{
console.log('onAfterAdd')
}}
onAfterRemove={()=> {
console.log('onAfterRemove')
}}
actionGuard={{
beforeAddRow: async () => {
console.log('beforeAddRow')
return true
},
beforeRemoveRow: async () => {
console.log('beforeRemoveRow')
return true
}
}}
itemRender={({listDom}, listMeta) =>
}
onClick={() => {
const copied = llmListRef.current?.get(listMeta.index);
const duplicated: Partial = {
id: randomUUID(),
llm_pn: copied!.llm_pn,
llm_desc: copied!.llm_desc,
unit_cost: copied!.unit_cost,
llm_qty: copied!.llm_qty,
}
llmListRef.current?.add(duplicated, listMeta.index + 1)
}}
/>
}
onClick={() => {
llmListRef.current?.remove(listMeta.index)
}}
/>
}
style={{marginBlockEnd: 8}}
size={'small'}
>
{listDom}
}
creatorRecord={{
id: randomUUID(),
[LLMCostDetailProps.unit_cost]: 0,
[LLMCostDetailProps.llm_qty]: 1,
}}
>
```
### 🏞 期望结果
希望可以正常触发 onAfterAdd onAfterRemove beforeRemoveRow
### © 版本信息
"@ant-design/pro-components": "^2.8.2",
"antd": "^5.22.3",
Contributor guide
Research direction
Start at the ProFormList actionRef API and reproduce the example with a custom FormListActionType ref. Trace the add and remove entry points and verify that onAfterAdd, onAfterRemove, and beforeRemoveRow fire when those operations are invoked through the ref.
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