我有一个less文件定义如下:
//style.less
.ant-modal-close-x
{
visibility: collapse;
}
在组件类中我这样使用它:
//testclass.tsx
import './style.less';
class ReactComp{
render(){
return <Modal>abc</Modal>
}
}
现在了解一些上下文:Modal 是一个 ant.design 模态对话框,它包含一个关闭按钮,该按钮的样式使用类名“ant-modal-close-x”。
因为我在 testclass.tsx 中包含了“style.less”,它现在会影响所有组件,包括其他使用 Modal 的组件,而我不希望关闭按钮的样式受到影响。
有没有办法专门覆盖每个组件的样式?
最佳答案
经过几个小时的尝试,我才发布了这个问题,我意识到了解决方案:
在 style.less 中,我执行以下操作:
.popup .ant-modal-close-x
{
visibility: collapse;
}
然后在render函数中的testclass.tsx中:
render() {
return <Modal className="popup">test</Modal>
}
关于javascript - 只影响导入样式的组件的样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51257966/