fix: List nest Field should correct removed #737
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Walkthrough该拉取请求对 Changes
Possibly related PRs
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #737 +/- ##
=======================================
Coverage 99.44% 99.44%
=======================================
Files 18 18
Lines 1256 1257 +1
Branches 295 315 +20
=======================================
+ Hits 1249 1250 +1
Misses 7 7 ☔ View full report in Codecov by Sentry. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (5)
src/Field.tsx (1)
Line range hint
699-707: 完善列表字段 preserve 属性的警告逻辑使用
isMergedListField替代原有判断，使警告更准确地针对列表字段触发。建议添加测试用例验证这个警告逻辑。需要我帮您编写相关的测试用例吗？可以验证以下场景：
- 直接的列表字段设置 preserve=false 时触发警告
- 嵌套列表字段的 preserve 行为
tests/list.test.tsx (4)
901-914: 建议优化测试组件的结构当前的测试组件结构可以通过以下方式改进：
- 提取重复的 InfoField 渲染逻辑到单独的组件
- 使用更具描述性的变量名替代硬编码的索引值
<Form ref={formRef} preserve={false}> <Form.List name="list"> {(fields, { remove }) => { + const handleRemove = (index: number) => remove(index); return ( <> {fields.map(field => ( <InfoField key={field.key} name={[field.name, 'user']} /> ))} - <button onClick={() => remove(1)}>remove</button> + <button onClick={() => handleRemove(1)}>remove</button> </> ); }} </Form.List> </Form>
917-923: 建议使用更简洁的测试数据结构当前的测试数据结构可以简化，因为第三个对象使用了不必要的多行格式。
formRef.current!.setFieldValue('list', [ { user: '1' }, { user: '2' }, - { - user: '3', - }, + { user: '3' }, ]);
925-927: 建议封装通用的异步等待逻辑多处使用了相同的超时等待逻辑，建议将其封装为测试辅助函数。
+const waitForUpdate = () => act(async () => { + await timeout(); +}); + -await act(async () => { - await timeout(); -}); +await waitForUpdate();Also applies to: 934-936
938-938: 建议增强断言的完整性当前只验证了字段值，建议添加额外的断言来确保 UI 状态也正确更新。
expect(formRef.current!.getFieldValue('list')).toEqual([{ user: '1' }, { user: '3' }]); +expect(container.querySelectorAll('input')).toHaveLength(2); +expect(container.querySelectorAll('input')[0].value).toBe('1'); +expect(container.querySelectorAll('input')[1].value).toBe('3');
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (2)
src/Field.tsx(3 hunks)tests/list.test.tsx(2 hunks)
🔇 Additional comments (5)
src/Field.tsx (4)
692-693: 优化列表字段上下文判断逻辑
通过引入 isMergedListField 变量，合并了来自 props 和 context 的列表字段状态，使得字段类型判断更加准确和统一。
695-697: 改进字段 key 的生成逻辑
基于 isMergedListField 优化了 key 的生成策略，确保列表字段和非列表字段有不同的 key 处理方式。
713-715: 更新 Field 组件属性传递
使用 isMergedListField 统一处理列表字段标识，使组件属性传递更加清晰。
Line range hint 692-715: 建议添加单元测试覆盖新增场景
为确保 isMergedListField 在各种场景下的正确性，建议补充以下测试场景：
- 列表上下文中的嵌套字段行为
- preserve 属性在不同层级的影响
- key 生成策略的正确性验证
tests/list.test.tsx (1)
896-897: 测试用例描述清晰且与 issue 关联
测试用例名称准确描述了要验证的功能，并通过注释链接到相关的 issue，这是一个很好的实践。
ref ant-design/ant-design#51702
Summary by CodeRabbit
Field组件对列表字段的处理，确保上下文正确合并并发出适当的警告。preserve属性设置为false时嵌套字段的行为。