如何在 material-ui 样式/JSS 中选择 id？

Posted 2023-02-22

【中文标题】如何在 material-ui 样式/JSS 中选择 id？

【英文标题】：How to select id in material-ui styles/JSS?

【发布时间】：2021-04-06 00:13:08

【问题描述】：

我正在编写一个 React 应用程序并使用基于 JSS 的 @material-ui/styles。我正在使用高阶组件 API 进行样式设置。如何通过样式中的 id 指定元素？我在 Material UI 和 JSS 文档中都进行了搜索，但找不到任何相关信息。比如：

const styles = (theme) => 
  className:
    propertyName:"something something"
  ,
  #elementId:
    propertyName:"something something"
  

【参考方案1】：

您可以将 css 添加到元素 Id 的一种方法是用父 div（或任何其他元素）包装它并向父级提供 CSS 并嵌套子级的 CSS

const styles = (theme) => 
  parentDiv:
      "& #childId": 
          propertyName: "something something"
      
  ,


// Inside the render method

<div className=styles.parentDiv>
    <div id="childId" />
</div>

【讨论】：

谢谢！这是唯一的方法吗？

如果您要使用 withStyles HOC，那么根据文档“它只是合并样式表提供的类名”。因此，我假设它只会为元素 ID 添加类名而不是 css

我明白了，非常感谢！升技很恼火，没有直接的方法来选择 id，但我会使用您提供的解决方案。