ant design组件样式隔离问题

Question

我有一个二次封装过的ant组件A，我通过：global修改了其样式。而其内部有一个子组件B，其样式和A不同但是由于A设置样式时使用了：global，导致B设置的样式无效被覆盖掉，如何解决这种样式污染问题呢

Answer 1

覆盖A的样式时，通过自定义父元素的class选中当前元素，即可解决大部分的样式冲突问题。比如：

:global(.ant-A) { color: red; }

改成

.custom-class {
    :global(.ant-A) { color: red; }
}

Answer 2

有一个东西叫做cssmodule 然后对应的也产生了scssmodule和lessmodule 专门为了解决这个问题的

另外 react使用createapp生成的好像默认就支持