How to handle Async responses when route is changed?

[pratishshr]

In my CRUD app, I am using same form component and same state for the form in redux for add and edit. When I call the API for fetching data using Promises for edit and before the response arrives, we change our route to "Add" form, all the form data will be auto filled for add item since i am using the same state for both add and edit. Is there any way to prevent this from happening?

my action creator:

fetchById: function (entity, id) {
        return function (dispatch) {
            dispatch(apiActions.apiRequest(entity));
            return (apiUtil.fetchById(entity, id).then(function (response) {
                    dispatch(apiActions.apiResponse(entity));
                    dispatch(actions.selectItem(entity, response.body));
            } 
       }
}

As response is late, "selectItem" is dispatched late. And when I open form for adding item, this form is filled with the data from response.

[markerikson]

That's a general code structure and usage question, not an issue with Redux. Please post usage questions over on Stack Overflow - you'll probably get more people answering anyway.

That said, two things you could try: keeping separate copies of the data for "display" vs "edit", and having some cancellation logic that would abort dispatching the action if you're not in the situation you want.