Use async react-select with redux-saga -

i try implement async react-select (select.async). problem is, want fetch in redux-saga. if user types something, fetch-action should triggered. saga fetches record , saved them store. works far. unfortunately loadoptions has return promise or callback should called. since newly retrieved options propagated changing property, see no way use select.async saga async fetch call. suggestions?

 <select.async    multi={false}    value={this.props.value}    onchange={this.onchange}    loadoptions={(searchterm) =>  this.props.options.load(searchterm)}   /> 

i had hack assigned callback class variable , resolve on componentwillreceiveprops. way ugly , did not work better solution.

thanks

redux-saga handling side effects asynchronously receiving options react-select. that's why should leave async stuff redux-saga. have never used react-select looking @ documentation solve way:

your component gets simple. value , options redux store. optionsrequested action creator options_requested action:

const connectedselect = ({ value, options, optionsrequested }) => (   <select     value={value}     options={options}     oninputchange={optionsrequested}   /> )  export default connect(store => ({   value: selectors.getvalue(store),   options: selectors.getoptions(store), }, {   optionsrequested: actions.optionsrequested, }))(connectedselect) 

a saga definition watches options_requested action trigged oninputchange, loads data given searchterm server , dispatches options_received action update redux store.

function* watchloadoptions(searchterm) {   const options = yield call(api.getoptions, searchterm)   yield put(optionsreceived(options) } 

in other words: make component pure possible , handle side-effect/async calls in redux-saga

i hope answer useful you.