如何删除 React Select 库中 Select 上的文本光标？

Question

我找不到删除图像中显示的闪烁文本光标的方法。当选择焦点时它会出现。

这是我选择的代码：

  <Select 
    options={sizeOptions}
    onChange={handleSelect}
    placeholder='Size'
    className='Select-container'
    classNamePrefix='Select'
    value={null}
  />  

Answer 1

光标出现是因为该Select组件使用输入。

如果您向组件添加classNamePrefixSelect属性，您可以div使用目标输入css并将颜色更改为transparent，div 内的输入继承其颜色：

<Select
  placeholder="Size"
  options={sizeOptions}
  className="Select-container"
  classNamePrefix="select"
/>

使用选择器将输入颜色更改为透明.prefix__input：

.select__input {
  color: transparent;
}