Updates are applied after refreshing the page

[aleemm625]

There is an issue in Form.js file.
In habdleSubmit function you need to make it async/await function as dispatch is returning promise, so you need to handle that promise by adding await before dispatch() function.
` const handleSubmit = async (e) => {
e.preventDefault();

	if (currentId) {
		await dispatch(
			updatePost(currentId, postData)
		);
	} else {
		await dispatch(createPost(postData));
	}
	clear();
};`

I was facing this issue, when I update the post it doesn't applied on the screen but when I refresh the page then changes are applied.
After debugging, I figured out that I need to to add await before dispatch() function.
if I was making some mistake, please guide me.

[philip06lee]

Faced this issue too. Puting await as above doesn't seem to work.

[PavanKalyan717]

There is an issue in Form.js file. In habdleSubmit function you need to make it async/await function as dispatch is returning promise, so you need to handle that promise by adding await before dispatch() function. ` const handleSubmit = async (e) => { e.preventDefault();

	if (currentId) {
		await dispatch(
			updatePost(currentId, postData)
		);
	} else {
		await dispatch(createPost(postData));
	}
	clear();
};`

I was facing this issue, when I update the post it doesn't applied on the screen but when I refresh the page then changes are applied. After debugging, I figured out that I need to to add await before dispatch() function. if I was making some mistake, please guide me.

worked like a charm..thanks

[Magalvo]

Since we are using thunk as a middleware async await wont work on this case, you can try this instead:

const handleSubmit = e => {
    e.preventDefault();

    if (currentId === 0) {
      dispatch(createPost(postData))
        .then(() => {
          clear();
        })
        .catch(error => {
          console.log('An error occurred submitting the form', error);
        });
    } else {
      dispatch(updatePost(currentId, postData))
        .then(() => {
          clear();
        })
        .catch(error => {
          console.log('An error occurred updating the form', error);
        });
    }
  };

OBS.: In this case I'm using the deprecated Redux store configuration as seen on the code along

const store = createStore(rootReducer, applyMiddleware(thunk));

Hope this helps