1. 在select上覆盖一层span,但不能影响select的交互
<div style={{ position: 'relative', display: 'inline-block' }}>
<select>
<option>Option 1</option>
<option>Option 2</option>
</select>
<span {{ position: 'absolute', top: '4px', right: '34px', pointerEvents: 'none' }}>
覆盖内容
</span>
</div>
select
元素需要放在最前面,以确保它能够在上层元素之下正常显示。
将 span
元素的 pointer-events
样式设置为 none
,以确保它不会影响 select
元素的交互。(在 React 中,使用内联样式时,属性名需要使用驼峰式命名,而不是连字符命名,因此你需要将 pointer-events
修改为 pointerEvents)