3

I have a script that does a while loop and does some requests


<p>Result @Content</p>

private string Content;
public async Task StartAsync() 
{
    while(!taskCanel) {  
          Content = await webSocket.SendAsync(..); 
          StateHasChanged();
          await Task.Delay(15000);
    }
   
}

but whenever I switch another page with my navbar then go back to this page it reset everything like it creates a new instance of my razor page.

How can I navigate to the page without losing all states and content?

Xinran Shen
  • 8,416
  • 2
  • 3
  • 12
qalooi
  • 33
  • 1
  • 3
  • It doesn't "reset" anything. There's no implicit storage in web applications. There's no expectation that anything will be retained unless you explicitly store it – Panagiotis Kanavos Dec 06 '21 at 14:32
  • @PanagiotisKanavos create a blazor template and run it then switch between the navbar you will see it reset everything to the default – qalooi Dec 06 '21 at 16:08
  • Again, nothing is reset, because nothing is meant to be retained unless *you explicitly save it*. Each navigation essentially creates a new form. Even in a Windows Forms application, closing a form and opening a new one wouldn't retain the old form's state unless you explicitly saved it somewhere – Panagiotis Kanavos Dec 06 '21 at 16:15
  • @PanagiotisKanavos in winforms you can hide and show the form and everything will remain but nvm. how can I otherwise make something instead of the navigationmanager that remains everything? – qalooi Dec 06 '21 at 16:19
  • But you seldom do that ... I hope. The form close button actually closes the form, it doesn't hide it. In any case, in a web application or SPA when you navigate you're closing the old page and opening a new one. These aren't forms. If you want to keep information, you'll have to store it. – Panagiotis Kanavos Dec 06 '21 at 16:20
  • You can use an injected service to store data in memory, eg in a `Dictionary`. You could write and read data from the server. Or you could use the server's session storage through eg [Blazored SessionStorage](https://github.com/Blazored/SessionStorage) to store data – Panagiotis Kanavos Dec 06 '21 at 16:22

2 Answers2

1

While you are navigating to another page all variables from the current page should be disposed. It is the standard procedure. The state management works with a different approach. If you want to retain the state of the current page then you have to subscribe to the changes in a global object and pull the change onInit hook or onafterrender hook. There is many more library for state management. Some of them are introduced here

Syed Mohammad Fahim Abrar
  • 785
  • 1
  • 7
  • 24
  • okay but how could I then manage the started Task? my Content property is then always being updated when I switch the pages like its no longer being updated when I stay on the page – qalooi Dec 06 '21 at 05:19
  • you can try it out by creating a blazor template and then do a loop to increment the Counter instead of the button click if you then click on the navbar another page and goes back you will see that it not updates anymore only if you change tabs again – qalooi Dec 06 '21 at 05:21
  • What u are trying to achieve here? Opening a WebSocket connection and syncing the real-time data with the current component? – Syed Mohammad Fahim Abrar Dec 06 '21 at 14:18
  • it should be a websocket chat but everytime I navigate to another page it reset everything. thats the only problem. it looks like that NavigateTo creates a new Instance of the razor page – qalooi Dec 06 '21 at 16:10
  • that should be the behaivour. than if u again come to the page the data should be pulled from the server again. – Syed Mohammad Fahim Abrar Dec 06 '21 at 17:35
  • you should determine how many messages from the previous chat you will show to the user. Once you enter the page than the data should be pulled from the server via API not via socket then after getting the data you can store in a state management framework. And you can use socket for new message arrival. I think you should look at signalR instead of websocket. – Syed Mohammad Fahim Abrar Dec 06 '21 at 17:40
  • you can get idea from here https://codewithmukesh.com/blog/realtime-chat-application-with-blazor/ – Syed Mohammad Fahim Abrar Dec 06 '21 at 17:40
1

You need to separate your data and your presentation. Your data, how you get it and manage it belongs in a scoped DI service. Your UI accesses this DI Service through inject and displays information from the service.

MrC aka Shaun Curtis
  • 19,075
  • 3
  • 13
  • 31