Can a razor/Blazor navigation link to either?

Falanga, Rod, DOH 260 Reputation points
2024-12-13T18:58:08.8833333+00:00

I think I've run into another mistaken idea, but I want to double check to see if I am wrong. I had hoped that I could navigate to either a razor page (.cshtml) or a Blazor page (.razor) from the same _Layout.cshtml. Here's a code snippet illustrating what I thought I could do:

<li class="nav-item">
   <a class="nav-link active" aria-current="page" href="/UserMaintenance">
       User Maintenance
   </a>
</li>
<li class="nav-item">
   <a class="nav-link active" aria-current="page" href="/TimeTrackInputTime">
      Input Time for User
   </a>
</li>

All of the links in my _Layout.cshtml are to razor pages, like the User Maintenance link above. However, Input Time for User is a Blazor page. When I tried going to that I got an HTTP 404 error. And even putting /TimeTrackInputTime.razor didn't help.

So, is it the case that if, as I have here a navigation using razor, it will not go to a Blazor component page?

ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,706 questions
Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,635 questions
0 comments No comments
{count} votes

2 answers

Sort by: Most helpful
  1. Bruce (SqlWork.com) 68,716 Reputation points
    2024-12-13T21:48:15.4366667+00:00

    if you are using Blazor components hosted by Razor, you don't navigate to a Blazor page, you navigate to a Razor page that hosts the Blazor component. There are no standalone Blazor pages with Blazor component support.

    if you are hosting a Blazor app on a razor site, then razor redirects to the blazor index hosting page. to route to a particular page in the Blazor app you would need to pass the desired page as query string value, that the Blazor app turned into a page navigation.


  2. Ping Ni-MSFT 4,805 Reputation points Microsoft Vendor
    2024-12-16T07:32:52.0966667+00:00

    Hi Falanga, Rod, DOH,

    By reading your previous question, it seems your original project is Razor Pages Project and now you want to migrate your current project to Blazor project? Not sure how do you configure your project now, be sure configure the steps below:

    To support routable Razor components in Razor Pages apps:

    Follow the guidance in the Configuration section.

    1. Add an App component to the project root with the following content. App.razor:
         @using Microsoft.AspNetCore.Components.Routing
         <Router AppAssembly="typeof(App).Assembly">
             <Found Context="routeData">
                 <RouteView RouteData="routeData" />
             </Found>
             <NotFound>
                 <PageTitle>Not found</PageTitle>
                 <p role="alert">Sorry, there's nothing at this address.</p>
             </NotFound>
         </Router>
      
    2. Add a _Host page to the project with the following content. Replace the {APP NAMESPACE} placeholder with the app's namespace. Pages/_Host.cshtml:
         @page
         @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
         <component type="typeof(App)" render-mode="ServerPrerendered" />
      

    Reference :Use routable components in a Razor Pages app

    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best regards,
    Rena


Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.