如何在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中設置默認值

回答

相關問題