Detecting navigation events blazor webassembly

Question

How can I detect when URL is changed? I need the event (URL change event) to perform some specific action based on the URL.

Answer 1

You can use NavigationManager which has built-in LocationChanged event.

To handle the event you can inject the NavigationManager like this:

@inject NavigationManager nav

To show the alert you may need to add the JSRuntime too:

@inject IJSRuntime js

and subscribe to the event with overriding OnInitialize()

protected override void OnInitialized()
{
    nav.LocationChanged += (o, e) => {
        js.InvokeVoidAsync("alert", "Alert"); // when location is changed invoke alert js function
    };
} 

You can check the repl of this example in this link: https://blazorrepl.com/repl/wabkuybC54SQD88I53