javascript - Dispatch and setState not working together, but are on their own -
i have datepicker component, when click on new date should set change date in redux store, , visibly ux-wise.
i'll put code down below, reason in handlechange
function, both setstate
, this.props.addfitler
there firing off, redux store updates correctly ux doesn't. if comment out this.props.addfilter
dispatch function, ux update correctly (and store doesn't).
why aren't both of these working together? i've tried changing order in they're called, extracting each function, using mapdispatchtoprops instead of calling action creator directly, no avail.
datepicker.js:
import datepicker 'react-datepicker'; class datepick extends react.component { constructor(props) { super(props); this.state = { date: moment() }; this.handlechange = this.handlechange.bind(this); } handlechange(date) { const { dashboardname } = this.props; const { name } = this.props.column; this.props.addfilter(date, dashboardname, name); this.setstate({date}); } render() { return ( <div style={{display: 'inline-block', fontweight: 'bold'}}> <datepicker dateformat="dd/mm/yyyy" selected={this.state.date} onchange={this.handlechange} /> </div> ); } } const mapactiontoprops = { addfilter }; export default connect(null, mapactiontoprops)(datepick);
the 'date' parameter comes through in handlechange function moment object 1 used set initialstate, isn't issue.
additional info: if console log before , after setstate()
logs initial state both times.
has ran problem or have ideas? if need see redux can update post more code don't think that's problem updates store fine.
i found solution, action creator calling doing synchronous operation , whole ui thread locked until finishes whatever it's doing. hence can delay call little bit of settimeout , go expected
Comments
Post a Comment