Question

我有一个组件，其中有另一个嵌套组件。在特定页面上，我希望该组件具有不同的背景颜色，但是它不起作用。我正在使用LESS并从styles.module.less导入样式。我在做什么错了？

<ParentComponent className={styles.parent}>
  <ChildComponent className={styles.child} />
</ParentComponent>

    .parent {
     .child {
      background-color: black;
    }
    }

Answer 1

您尝试过这样设置样式吗？

.parent .child {
  background-color: black;
}

希望有帮助。

Answer 2

顺便说一下，您可以像这样设置线条样式：

<ChildComponent style={{backgroundColor: 'black'}} className={styles.child} />

如何设置嵌套的React组件的样式

2 个答案: