将 React 组件与 css 模块结合使用，有没有办法在悬停时影响父组件的子组件类（删除过一次或两次的表兄弟）？

Answer 1

当另一个组件中的特定元素悬停时影响同级组件的样式，您可以使用 CSS 变量和相邻同级选择器。

ComponentA.module.css：

.componentA {
  --hovered: 0;
}

.componentA:hover {
  --hovered: 1;
}

ComponentC.module.css：

.componentD:hover ~ .componentB {
  background-color: var(--hovered, 0) ? red : initial;
}

此方法使用 CSS 变量在组件和相邻同级选择器之间传递悬停状态信息，以将样式应用到目标组件