在material ui中使用sass like插值来获得类似BEM的类名
提问于 2020-04-23 16:08:34
const useStyles = makeStyles({
block: {
`${&}__element `: {
color: 'green',
}
},
});上面的代码在material UI中不起作用。有没有办法像sass插值一样对parent selector '&'进行插值来得到类名block__element呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-23 16:19:53
你不需要任何特殊的语法来处理它。&本身将被.classNameGeneratedForBlock替换，因此您可以执行以下操作：
const useStyles = makeStyles({
block: {
"&__element": {
color: "green"
}
}
});下面是一个完整的工作示例：
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
const useStyles = makeStyles({
block: {
backgroundColor: "lightblue",
"&__element": {
color: "green"
}
}
});
export default function App() {
const classes = useStyles();
return (
<div className={classes.block}>
<h1 className={`${classes.block}__element`}>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
</div>
);
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61391830
复制相关文章
腾讯云开发者
