Reactjs 如何在物料UI/JSS中针对复杂组件的同级/子级

我正在项目中使用材质UI。它工作得很好，但有一件事我搞不清楚，那就是如何使用JSS设计子组件和兄弟组件的样式

例如，材质UI的组件渲染为以下内容：

字段标签

从中我知道这只是一些低级组件的包装。我可以像这样使用

createMuiTheme（）

瞄准这些单独的组件：

MuiInput：{
表单控制：{
“标签+&”：{
玛金托普：“30px”
}
},
根目录：{
“&$focused”：{
boxShadow:'0px 3px 8px rgba（1081081080.16）'
},
边界半径：“40px”，
填充：“7px 16px”，
背景：“白色”，
过渡：“框阴影0.2s”，
}
}

---

我不明白的是如何定位这些组件中的子级和/或同级-例如，在我的

createMuiTheme

函数中，如何定位MuiFormControl组件中的MuiFormLabel组件？或者，如果MuiFormLabel组件具有特定的类，我如何以MuiInput组件为目标？我知道我可以使用普通CSS（例如，&label'）以元素为目标，但我不知道如何以组件/类为目标，因为类名是动态的。

您可以直接设置MuiFormLabel组件的样式，为什么需要在MuiFormControl上设置样式？

您可以使用样式将每个组件包装在自己的

中，并直接设置样式。将样式保留在组件级别，而不是尝试从其父级设置嵌套组件的样式


const styles=createStyles({
根目录：{
填充：0
},
儿童根：{
颜色：“红色”
}
});
类MyComponent扩展了React.Component{
render（）{
const{classes}=this.props；
返回(

酒吧

);    
}
}
const fooComponent=带有样式（样式）（（道具）=>{
返回(

{props.children}

);
});
导出默认样式（样式）（MyComponent）但是针对兄弟姐妹呢？我知道我可以使用“&”来定位当前元素，我可以使用普通的CSS选择器直接定位元素，因为类名是自动生成的，所以我不知道如何实际定位特定的组件。这可能吗？@AndrewKilham您使用相同的语法，只引用“原始”名称（如
&:hover:not（$button）
）。看看我的问题：或者这一个，你能提供一个完整的例子吗？