javascript - 如果 styleName 存在，则检查 React 组件

Question

我计划动态调用我在 React 组件上导入的 css 选择器。但如果样式不存在，则会抛出错误

Uncaught Error :无法解析样式名称“dynamicvalue3”。

是否有可能在 react 中进行这样的检查 isClassExists('dynamicvalue3')？

例子:这是我的 css 文件示例内容。文件名为 mycustomcss.styles.css

.dynamicvalue1 {}
.dynamicvalue2 {background-color: #87c930;}

我的 react 组件的渲染方法是

import theme from './mycustomcss.styles.css';
.....
const badge = /* This will be fetch dynamically. And the values will vary from dynamicvalue1, dynamicvalue2 etc.. */;
.....
return (<div styleName={badge}>Text here</div>}/>);

问题:由于 dynamicvalue3 不存在，它会抛出一个错误。所以我在想这种方法是否确实可行。

谢谢

Answer 1

像这样检查它 theme.dynamicvalue3 如果它存在，它会返回一个真值

const badge = theme.dynamicvalue3 ? theme.dynamicvalue3 : theme.dynamicvalue2