Select Arrow Icon

[topazur]

 arrowNode = (
      <TransBtn
        className={classNames(`${prefixCls}-arrow`, {
          [`${prefixCls}-arrow-loading`]: loading,
+         [`${prefixCls}-arrow-clear`]: mergedAllowClear,
        })}
        customizeIcon={suffixIcon}
        customizeIconProps={{
          loading,
          searchValue: mergedSearchValue,
          open: mergedOpen,
          focused: mockFocused,
          showSearch: mergedShowSearch,
        }}
      />
    );

我通过 createPortal 在后缀插入其他图标后，改变现有 .ant-select:hover .ant-select-arrow:not(:last-child) {opacity: 0;} 样式我可能需要自行维护 mergedAllowClear 变量，判断hover时是否存在 clear 图标，存在才隐藏。能否将这个变量传递给 arrow 图标，这样包装层可以减少很多代码

https://stackblitz.com/edit/react-x7atw3-ahj1vm

[topazur]

/* 仅有一个 span 时不隐藏（其实是 mergedAllowClear 等于 false, 即不显示 clear 图标）。但是限制了插入的节点不能span */
.ant-select:hover > span:only-of-type {
  opacity: 1 !important;
}

虽然这样也可以覆盖样式，但是限制了插入的节点不能是 span，或者后续该组件内部添加了额外的 span 节点，就不适用了。

如果可以添加这个样式的话，就不用通过 has、:not(:last-child)、:only-of-type 等局限性的 api 来实现了 https://github.com/ant-design/ant-design/blob/8890eff05e0cb7596a702c51e658682e1757fc67/components/select/style/index.ts#L184