Reactjs 反应选择不在移动浏览器上工作

我在一个带有Redux表单的表单上使用React Select。一切都可以在桌面浏览器（firefox和chrome）上运行。当我在手机上测试时，所选值不会显示。该值不会传递给SelectInput组件

下面的代码是SelectInput组件：

const SelectInput = (props) => {
   const className = `field required ${props.meta.error && props.meta.touched ? 'error' : ''}`
  
    const handleBlur = () => {
      setTimeout(() => {
        const { input } = props;
        input.onBlur(input.value);
      }, 1);
    };  
    return (
      <div className={className}>
      
      <Select
          {...props}
   
        value={props.input.value}
        onChange={value => props.input.onChange(value)}
         // onBlur={() => props.input.onBlur(props.input.value)}
        onBlur={handleBlur}
        options={props.options}
        styles={colourStyles}
        />
        <div>
          {renderError(props.meta)}
          </div>
      </div>
    
    )
  };
  export default SelectInput

const SelectInput=（道具）=>{
const className=`所需字段${props.meta.error&&props.meta.toucted？'error'：'}`
常量车把长度=（）=>{
设置超时（（）=>{
const{input}=props；
input.onBlur（input.value）；
}, 1);
};  
返回(
props.input.onChange（值）}
//onBlur={（）=>props.input.onBlur（props.input.value）}
onBlur={handleBlur}
选项={props.options}
样式={colorstyles}
/>
{renderError（props.meta）}
)
};
导出默认选择输入

这就是我在表单上使用它的方式

      <span><b>Gênero</b></span><br></br>
      <Field
        name='genero'
        placeholder="Selecione uma opção"
        options={generos}
        value={genero}
        onChange={handleGeneroChange}
        component={SelectInput}
      />

Gênero

---

React是版本16.13.1 React select 3.1.0 Redux form 8.3.6。

以下组件适用于移动和桌面浏览器

const SelectInput = (props) => {

 const className = `field required ${props.meta.error && props.meta.touched ? 'error' : ''}`

  const handleBlur = () => {
    setTimeout(() => {
      const { input } = props;
      input.onBlur(input.value);
    }, 1);
  };  
  return (
    <div className={className}>
    <Select
        {...props}
      
      value = {props.options.filter(item=>item.value === props.input.value)[0]}
      onChange={value => props.input.onChange(value)}
      onBlur= { event => event.preventDefault()}
      options={props.options}
      styles={colourStyles}
      />
      <div>
        {renderError(props.meta)}
        </div>
    </div>
  )
};

const SelectInput=（道具）=>{
const className=`所需字段${props.meta.error&&props.meta.toucted？'error'：'}`
常量车把长度=（）=>{
设置超时（（）=>{
const{input}=props；
input.onBlur（input.value）；
}, 1);
};  
返回(
item.value==props.input.value）[0]}
onChange={value=>props.input.onChange（value）}
onBlur={event=>event.preventDefault（）}
选项={props.options}
样式={colorstyles}
/>
{renderError（props.meta）}
)
};

当您通过开发者工具以移动设备宽度/高度显示页面时，桌面浏览器上是否会出现这种情况？否，仅在移动浏览器上我看到redux forms在移动浏览器上存在问题，您是否在其他移动浏览器上试过？问题发生在iphone的safari mobile和FirefoxThreak@Tasos Bu上