Relative routing in Blazor WebAssembly

602 Views Asked by At

I'm new with Blazor and C#, and I'm trying to figure out how navigate using relative path. Suppose I have this structure:

Index:    /
Page2:    /pageTwo
Page3:    /pageThree
PageFour: /pageThree/pageFour

I'd like to navigate among these pages using relative path.

I tried to navigate using NavigationManager:

From index I can go to pageTwo with NavigationManager.NavigateTo("pageTwo");

From Page2 I would like to go to page three, but using following doesn't work:

  • NavigationManager.NavigateTo("../pageThree")
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("../pageThree").AbsoluteUri) I tried
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("~/../pageThree").AbsoluteUri) and page is accessed correctly, but why use ~? (searching for an answer about relative path I found people talking about ~ and I wanted to try)

From Page3 I'd like to go to Page4 but none of my try is working:

  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("./pageFour").AbsoluteUri)
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("~/./pageFour").AbsoluteUri)
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("~/pageFour").AbsoluteUri)
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("pageFour").AbsoluteUri)
  • NavigationManager.NavigateTo(NavigationManager.ToAbsoluteUri("/pageFour").AbsoluteUri)

I wrote a little program showing my test at https://blazorfiddle.com/s/9lnhs40p

1

There are 1 best solutions below

1
On

I don't think you need to use ./ pattern.

Just use / as below

NavigationManager.NavigateTo("/");
NavigationManager.NavigateTo("/pageTwo");
NavigationManager.NavigateTo("/pageThree");
NavigationManager.NavigateTo("/pageFour");

NavigationManager.NavigateTo("/login");
NavigationManager.NavigateTo("/logout");