版本
angular:9.x
nz-zorro:9.x
nz-zorro官网
问题
<nz-tree-select
[nzDropdownMatchSelectWidth]="false"
style="width: 180px;"
nzAllowClear
[(ngModel)]="type"
[nzNodes]="searchNodes"
[nzCheckStrictly]="true"
nzShowSearch
nzPlaceHolder="请选择模版类型"
[nzDropdownStyle]="{
'max-height':'220px'}"
>
</nz-tree-select>
分析
当点击搜索框的时候,这时候会添加.ant-select-single.ant-select-open .ant-select-selection-item 的样式,作用就是让文字的不透明度设为0.4。
于是,这里我们可以通过将opacity设置为0,进行透明化,这样就不会出现重叠了
解决
//解决ng-zorro-antd低版本的treeSelect的bug(选中后文字透明,就不会出现重叠的情况了)
.ant-select-single.ant-select-open .ant-select-selection-item{
opacity: 0;
}
该问题在10.x的版本中已经修复了