Odd "isLoading" behaviour in Redux app #1128

New Issue

fergalmoran · 2025-08-09T17:18:59Z

fergalmoran commented

2025-08-09 17:18:59 +00:00

Originally created by @huwjeffries on 1/9/2017

Hi There,
I've been trying out ASP.NET core spa with React + Redux and I'm seeing some odd behaviour with server-side data loading. I can re-create the issue in the vanilla project template generated by yoman. Whilst not necessarily a bug, it is difficult to explain what's going on and wonder if you can shed some light?

To re-create the issue:
npm install -g yo generator-aspnetcore-spa (gives me version 0.7.2)
yo aspnetcore-spa (and choose React with Redux)

Edit the ClientApp\store\WeatherForecast.ts and change Line 47 from:
if (startDateIndex !== getState().weatherForecasts.startDateIndex) {
to:
if (!getState().weatherForecasts.isLoading) {

i.e. Only load data if the data isn't already loading. (A sensible pattern for API calls that don't need parameters). Also comment out the "If" check on line 76, 82 & 83 in the same file.

Edit ClientApp\components\FetchData.tsx. Delete the whole componentWillReceiveProps method (otherwise you get an infinite refresh cycle).

Launch the site and click around - you can see the WeatherForecast data fine. Hit F5 on the WeatherForecast page and now you get a Javascript (React) error. Debugging shows that the "this.props.isLoading" property is now permanently set to True (but the weather forecast data has been loaded). It must be an oddity of server-side pre-rendering, but I can't see any code path that would result in the IsLoading flag getting stuck on True. Doubtless something going on that I'm not aware of. Any help you can give would be much appreciated. Thanks!

*Originally created by @huwjeffries on 1/9/2017* Hi There, I've been trying out ASP.NET core spa with React + Redux and I'm seeing some odd behaviour with server-side data loading. I can re-create the issue in the vanilla project template generated by yoman. Whilst not necessarily a bug, it is difficult to explain what's going on and wonder if you can shed some light? To re-create the issue: npm install -g yo generator-aspnetcore-spa (gives me version 0.7.2) yo aspnetcore-spa (and choose React with Redux) Edit the ClientApp\store\WeatherForecast.ts and change Line 47 from: if (startDateIndex !== getState().weatherForecasts.startDateIndex) { to: if (!getState().weatherForecasts.isLoading) { i.e. Only load data if the data isn't already loading. (A sensible pattern for API calls that don't need parameters). Also comment out the "If" check on line 76, 82 & 83 in the same file. Edit ClientApp\components\FetchData.tsx. Delete the whole componentWillReceiveProps method (otherwise you get an infinite refresh cycle). Launch the site and click around - you can see the WeatherForecast data fine. Hit F5 on the WeatherForecast page and now you get a Javascript (React) error. Debugging shows that the "this.props.isLoading" property is now permanently set to True (but the weather forecast data has been loaded). It must be an oddity of server-side pre-rendering, but I can't see any code path that would result in the IsLoading flag getting stuck on True. Doubtless something going on that I'm not aware of. Any help you can give would be much appreciated. Thanks!

fergalmoran closed this issue

2025-08-09 17:18:59 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#1128