從rea-select中選擇多個redux-form無法按預期工作

因此，iam使用多重select從react-select使用onBlur hack（？）進行反應選擇，因爲當我提交它時，在值從rea-select中選擇多個redux-form無法按預期工作

但訪問任何多選擇域（即使我不選擇任何內容）我最終都沒有值後）所選擇的數據（不顯示任何內容，但這個
）

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

<Select 
      value="one" 
      options={options} 
      multi={true} 
      {...input} 
      onBlur={() => { 
       input.onBlur({...input.value}) 
      } 
      } 
     />

所以我最終在redux狀態的值，但我不能看到該字段中的任何值。任何人都知道這是爲什麼發生？

來源

2016-12-11 eersteam

我沒有使用過的react-select更現代的版本，但在一年前，出現了一些問題，不得不split()由delimiter的字符串值，以獲取值作爲一個數組，然後join()他們再次給到零件。

這樣的東西：

if (multi) { 
    selectValue = value ? value.join(delimiter) : '' 
} else { 
    selectValue = value || null 
}

我建議檢查值是終極版正是採用終極版DevTools，並獲得通過，以react-select什麼價值的道具。我相信你會在那裏發現問題。

來源

2016-12-12 16:13:41

感謝你的回覆Erik。我在發佈這個問題後做了這件事，事實證明我必須在onBlur func而不是object中傳入所選值，所以'input.onBlur（[... input.value]）'解決了這個問題。話雖如此，你是否建議使用除反應選擇以外的其他東西？同樣使用redux-form使我很難控制表單輸入的狀態。你是否推薦給一個新來的人？ – eersteam

PS我知道REDX形式是你的回購，所以我希望你沒有偏見（嘿嘿） – eersteam

嘿。還有另一個名爲'react-redux-form'的庫，可能更適合你的思維方式。不，我真的沒有更好的選擇來反應 - 選擇多選。 –

下面是如何使它工作的示例。反應選擇（1.0.0-rc.2），終極版型（5.3.4）

SelectInput.js

import React from 'react'; 
import Select from 'react-select'; 
import 'react-select/dist/react-select.css'; 

export default (props) => (
    <Select 
    {...props} 
    value={props.input.value} 
    onChange={(value) => props.input.onChange(value)} 
    onBlur={() => props.input.onBlur(props.input.value)} 
    options={props.options} 
    /> 
);

MyAwesomeComponent.js

import React, {PureComponent} from 'react'; 
import SelectInput from './SelectInput.js'; 

class MyAwesomeComponent extends PureComponent { 
    render() { 
    const options = [ 
     {'label': 'Germany', 'value': 'DE'}, 
     {'label': 'Russian Federation', 'value': 'RU'}, 
     {'label': 'United States', 'value': 'US'} 
    ]; 
    return (
    <Field 
     name='countries' 
     options={options} 
     component={SelectInput} 
     multi 
    /> 
) 
};

來源

2017-01-20 11:33:08 andrewkslv

這適用於多重選擇和非多重選擇。 – turhanco

最佳答案！救我一天！ – klijakub

從rea-select中選擇多個redux-form無法按預期工作

回答

相關問題