Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(card): loading属性增加TNode支持 #3051

Merged
merged 2 commits into from
Aug 31, 2024

Conversation

huangchen1031
Copy link
Collaborator

fix #2997

🤔 这个 PR 的性质是?

  • 日常 bug 修复
  • 新特性提交
  • 文档改进
  • 演示代码改进
  • 组件样式/交互改进
  • CI/CD 改进
  • 重构
  • 代码风格优化
  • 测试用例
  • 分支合并
  • 其他

🔗 相关 Issue

#2997

💡 需求背景和解决方案

📝 更新日志

  • fix(card): loading属性增加TNode支持

  • 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项⚠️

  • [x 文档已补充或无须补充
  • 代码演示已提供或无须提供
  • TypeScript 定义已补充或无须补充
  • Changelog 已提供或无须提供

Copy link
Contributor

github-actions bot commented Aug 20, 2024

失败

@uyarn
Copy link
Collaborator

uyarn commented Aug 21, 2024

/update-snapshot

@uyarn uyarn added ⛔️ pending the issue won't be processed right now and removed ⛔️ pending the issue won't be processed right now labels Aug 22, 2024
@uyarn
Copy link
Collaborator

uyarn commented Aug 28, 2024

这样有个小问题,即便没有使用loading这个API,即正常写了<Card>xxx</Card>也会在最外层有一个loading parent的包裹,如snapshot的变更,
image
是否可以先判断props是否有loading这个API的使用,Reflect.has(props,'loading'),如果true,即使用了 再用loading做最外层;如果没有使用loading ,理论上也不会有变化一说了,就正常渲染之前的节点即可,这样不会有最外层多出一个节点。

@HaixingOoO
Copy link
Collaborator

这样有个小问题,即便没有使用loading这个API,即正常写了<Card>xxx</Card>也会在最外层有一个loading parent的包裹,如snapshot的变更, image 是否可以先判断props是否有loading这个API的使用,Reflect.has(props,'loading'),如果true,即使用了 再用loading做最外层;如果没有使用loading ,理论上也不会有变化一说了,就正常渲染之前的节点即可,这样不会有最外层多出一个节点。

可以這樣,但是就會還是以前的問題,card的children會每次都rerender,不會保留form的值

@HaixingOoO
Copy link
Collaborator

HaixingOoO commented Aug 28, 2024

這樣判斷去掉loading-parent,要不沒loading也有

let childrenNode:React.ReactNode = null;
if(!Reflect.has(props,'loading')){
 childrenNode = React.cloneElement(card, { style })
} else {
 if(React.isValidElement(children)){
   childrenNode = React.cloneElement(loading, null,children)
   } else {
   childrenNode = <Loading {...loadingProps} loading={!!loading}>{card}</Loading>
 }
}

@huangchen1031
Copy link
Collaborator Author

這樣判斷去掉loading-parent,要不沒loading也有

let childrenNode:React.ReactNode = null;
if(!Reflect.has(props,'loading')){
 childrenNode = React.cloneElement(card, { style })
} else {
 if(React.isValidElement(children)){
   childrenNode = React.cloneElement(loading, null,children)
   } else {
   childrenNode = <Loading {...loadingProps} loading={!!loading}>{card}</Loading>
 }
}

猴到老,学到老。已经加上这段逻辑!

@HaixingOoO
Copy link
Collaborator

@uyarn 看看test,我的windows看不了

@uyarn
Copy link
Collaborator

uyarn commented Aug 31, 2024

/update-snapshot

@uyarn
Copy link
Collaborator

uyarn commented Aug 31, 2024

看了下是图标的更新导致的快照差异,这个PR没其他问题,可以合并了,快照的另提个PR修复下

@uyarn uyarn merged commit 3f9a77a into Tencent:develop Aug 31, 2024
5 of 6 checks passed
@uyarn uyarn mentioned this pull request Aug 31, 2024
16 tasks
This was referenced Sep 12, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Card] 在loading状态变更时children中的内容会重新渲染
3 participants