Skip to content

[Table] 可展开和收起的表格,添加stripe属性的斑马纹导致切换样式时，斑马纹会动态变换 #2669

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.

Sign up for GitHub

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

Jump to bottom
Open
HaixingOoO opened this issue Dec 15, 2023 · 3 comments · May be fixed by #2823 or Tencent/tdesign-common#1764
Open

[Table] 可展开和收起的表格,添加stripe属性的斑马纹导致切换样式时，斑马纹会动态变换 #2669

HaixingOoO opened this issue Dec 15, 2023 · 3 comments · May be fixed by #2823 or Tencent/tdesign-common#1764
Assignees
@chaishi
Labels
🎨 design Something about design or style 🙏🏻 help wanted Extra attention is needed

Comments

@HaixingOoO
Copy link
Collaborator

tdesign-react 版本

latest

重现链接

https://stackblitz.com/edit/react-kd1cyb?file=src%2Fdemo.jsx

重现步骤

6f10f13adc290b96a82923dd9c6ce7d4.mp4
  • stackoverflow
    在您的特定情况下，您可以简单地反转奇数和偶数 nth-of-type 的 CSS 规则（请参阅代码片段）。 nth-of-type 引用标签，即 div 元素，而不是类，因此也计算第一个没有类的 div。(也就是table斑马纹展開這裡的元素是相同的tr，所以不會忽略)

期望结果

展开的斑马纹不会样式错乱

实际结果

展开的斑马纹会样式错乱

框架版本

React(18.2.0)

浏览器版本

chrome(116.0.5845.111)

系统版本

window10

Node版本

18.20.0

补充说明

No response
@github-actions GitHub Actions
Copy link
Contributor

👋 @HaixingOoO，感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 15, 2023 •
edited
Loading

♥️ 有劳 @yunfeic @tengcaifeng @Yacent @basecss 尽快确认问题。
确认有效后将下一步计划和可能需要的时间回复给 @HaixingOoO 。

@HaixingOoO HaixingOoO added the 🎨 design Something about design or style label Dec 15, 2023
@chaishi chaishi changed the title [Table] 可展开和收起的表格,添加stripe属性的斑马纹导致切换样式错乱 [Table] 可展开和收起的表格,添加stripe属性的斑马纹导致切换样式时，斑马纹会动态变换 Dec 15, 2023
@chaishi chaishi added the 🙏🏻 help wanted Extra attention is needed label Dec 22, 2023
@Summer-Shen
Copy link
Contributor

似乎这种一闪而过只有 react 有，我测了一下 vue-next 的就不会闪，只是在展开的即时更改奇数偶数行的背景色。

Ali-ovo added a commit to Ali-ovo/tdesign-react that referenced this issue Mar 29, 2024
@Ali-ovo
fix: fix issuses
2ec09fc 
fix: Tencent#2669
@Ali-ovo Ali-ovo linked a pull request Mar 29, 2024 that will close this issue
Open
16 tasks
Ali-ovo added a commit to Ali-ovo/tdesign-react that referenced this issue Mar 29, 2024
@Ali-ovo
fix(Table): fix table stripe style error
61e4f19 
fix: Tencent#2669
@Ali-ovo Ali-ovo linked a pull request Apr 8, 2024 that will close this issue
Open
16 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@chaishi chaishi

Labels
🎨 design Something about design or style 🙏🏻 help wanted Extra attention is needed
Projects
None yet
Milestone
No milestone
3 participants
@chaishi @Summer-Shen @HaixingOoO