React-redux app is not refreshing stored with delay

Viewed 106

I'm using React JS for my web app.

It gets data from the API using Redux and Axios.

When I enter to some profile page in app, It gets data from the API and renders the page.

The problem is, when I go to another profile, it first opens the page with previous profile's data, then after 2-3 seconds the information changes into the newly fetched data.

In some components the change does not happen and they show previous information. Only after 2-3 refreshes you see the change.

Almost all of my API interaction functions are async functions.

What am I doing wrong?

I'm new to React, I don't know what part of code to paste here for more details. Have no clue what this issue might be connected with.

1 Answers

Your 2 triggers of going to a new profile page and calling fetch are called together. You need to separate them. Option 1: Show new page, then loading, then fetched profile. Option 2: Show loading, wait for the fetch to succeed, then switch.

Related