如何在react-select中设置默认值

我有使用react-select的问题。我使用了redux形式，并且使我的react-select组件与redux形式兼容。下面是代码：如何在react-select中设置默认值

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>

但问题是，我的下拉已经不是默认值如我所愿。我做错了什么？有任何想法吗？

来源

2017-04-19 user7334203

这是正确的：价值= {} props.input.value。你面临的问题是什么？ – Ved

我的问题是，我想我的选择有一个defaultValue，当我第一次渲染它，但我不能 – user7334203

什么是props.input.value当它首先渲染时的值？ – Ved

我猜你需要像这样

<Select 
    {...props} 
    value={props.input.value?props.input.value:"Any"} 
    onChange={value => props.input.onChange(value)} 
    onBlur={() => props.input.onBlur(props.input.value)} 
    options={props.options} 
    placeholder={props.placeholder} 
    selectedValue={props.selectedValue} 
    /> 
);

来源

2017-04-19 12:37:16 Ved

与redux/react绑定点是这样ui实时反映对象的值。这种方法解除了这种约束。考虑在减速器中设置默认值。 –

@JosephJuhnke先检查问题。这是如何设置默认值。 – Ved

我有一个类似的错误。确保您的选项具有值属性。

<option key={index} value={item}> {item} </option>

然后将选择元素值初始匹配到选项值。

<select 
    value={this.value} />

来源

2017-07-07 04:45:59 Drizzel

我认为这是最好的/最优雅的解决方案。我正确地认为？ – user2026178

我刚刚通过这个自己并选择设置在reducer INIT函数的默认值。

如果你将你的select和redux绑定，那么最好不要用一个不代表实际值的选择默认值“解除绑定”，而应该在初始化对象时设置该值。

来源

2017-08-03 21:37:26

如果你的选择是这样的

var options = [ 
    { value: 'one', label: 'One' }, 
    { value: 'two', label: 'Two' } 
];

你{props.input.value}应与'value'在贵{props.options}

含义，props.input.value应该是'one'或'two'

来源

2017-10-20 06:37:27 naamadheya

如何在react-select中设置默认值

回答

相关问题