目的
### 修改antd的默认样式
### 不污染全局样式
实现方法
### antd提供了 :global修改全局样式的写法
### 需要加个命名空间(容器组件类名),避免造成覆盖全局样式
在内部的容器组件内(一般组件)
.namespace{:global{.ant-input{border: none;}} }
实现效果: 去掉class名为namespace下的antd输入框的边框,antd的样式名一定要写在global里面才能生效
另外还有一些弹窗,气泡等组件,因为实现原理是直接将dom插入到body下面,所以我们不能直接在外层dom添加namespace。
antd同样提供了修改方法,如下:
<DropdownoverlayClassName={styles.namespace}overlay={<div>content</div>}trigger={['click']}>下拉菜单</Dropdown>
主要用到overlayClassName添加专门的namespace,再和 :global 配合使用,就能很方便的修改掉antd的默认样式,Popover/Popcomfirm/Dropdown/Modal 弹窗类组件基本都适用。