[ANTD][CSS]覆盖某单一组件样式

覆盖某单一组件样式

1. 遇到的问题
   

   在使用Cascader时，如果options较多，下拉菜单高度太小，但是Cascader组件popupClassName属性不能修改下拉菜单高度（菜单高度整体会修改，但实际显示option的区域不会变）。

2. 问题原因
   检查发现实际控制option样式的类名如图。
   

3. 覆盖原有样式
   在css文件中覆盖其样式

    :global {
           .ant-cascader-menu {
               height: 500px !important;
           }
       }
   

   原来的样式被覆盖掉了。

4. 再次发现问题
   在其他component中使用Cascader组件时，样式同样被覆盖成我上面改的样子。

5. 解决

   1. 修改css文件上述代码

   .myCascaderMenu {
       :global {
           .ant-cascader-menu {
               height: 500px !important;
           }
       }
   }
   

   2.将“.myCascaderMenu”引入即可

   	import Style from '../style.less';
   	...	
   	
   	<Cascader
   		options={options}
   		popupClassName={Style.myCascaderMenu}
   	/>
   

** 其他组件同理，可以尝试修改