[英]change className to using template literals
i'm trying to learn template literals, i have project of mine i need to use template literals there, i have a question which seems very simple, but dont know what i am doing wrong我正在尝试学习模板文字,我有我的项目我需要在那里使用模板文字,我有一个看起来很简单的问题,但不知道我做错了什么
this is working:这是有效的:
const classes = props.classes;
return (
<List
component="div"
data-testid="SelectionListt"
className={classes.selectionList__sites}
>
</List>
);
my question is how should i turn that className using template literals.我的问题是我应该如何使用模板文字来转换该类名。
This is what i have done:这就是我所做的:
const classes = props.classes; return ( <List component="div" data-testid="SelectionListt" className={` ${classes + ".selectionList__sites"} `}` > </List> );
this is my selectionList__sites:这是我的 selectionList__sites:
selectionList__sites: { backgroundColor: "white", "&:hover": { backgroundColor: " red", color: "black", border: "1px solid yellow", }, },
English is not my mother language so there could be mistakes.英语不是我的母语,所以可能会出现错误。
Template literals have no need for regular quotes inside them, basically the entire content between backticks is handled as a string, except for values inside ${}.模板文字内部不需要常规引号,基本上反引号之间的整个内容都作为字符串处理,除了 ${} 中的值。
Assuming that props.classes is a string, I would write your className like this:假设 props.classes 是一个字符串,我会这样写你的 className:
className={`${classes}.selectionList__sites`}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.