如何在react-select中设置默认值 [英] How to set a default value in react-select

问题描述

我在使用react-select时遇到问题。我使用redux表单，并且使我的react-select组件与redux表单兼容。以下是代码：

I have an issue using react-select. I use redux form and I've made my react-select component compatible with redux form. Here is the code:

const MySelect = props => (
    <Select
        {...props}
        value={props.input.value}
        onChange={value => props.input.onChange(value)}
        onBlur={() => props.input.onBlur(props.input.value)}
        options={props.options}
        placeholder={props.placeholder}
        selectedValue={props.selectedValue}
    />
);

这里是我的渲染方式：

<div className="select-box__container">
    <Field
    id="side"
    name="side"
    component={SelectInput}
    options={sideOptions}
    clearable={false}
    placeholder="Select Side"
    selectedValue={label: 'Any', value: 'Any'}
    />
</div>

但是问题是我的下拉菜单没有我想要的默认值。我做错了什么？有想法吗？

But the problem is that that my dropdown has not a default value as I wish. What I'm doing wrong? Any ideas?

推荐答案

我想您需要这样的东西：

I guess you need something like this:

const MySelect = props => (
<Select
    {...props}
    value={props.options.filter(option => option.label === 'Some label')}
    onChange={value => props.input.onChange(value)}
    onBlur={() => props.input.onBlur(props.input.value)}
    options={props.options}
    placeholder={props.placeholder}
  />
);

这篇关于如何在react-select中设置默认值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！