Blazor: A more flexible and easy-to-use router.

[hez2010]

Is your feature request related to a problem? Please describe.

Feature request.
Currently we can only pass parameters via query in Router, and also we cannot apply Layout to NotFoundContent. It's not flexible at all and it's really hard to use.

Describe the solution you'd like

I'd like to introduce a <Switch> which performs like a <Frame> in UWP, and we can use <Route> to set routed content and path, also we can pass parameters from both query and component parameters, and query parameters are automatically included.
And it matches routes by the order from the top to bottom.

<Switch>
    <Route> <!-- multiple templates -->
        <Route.path Path="template1"></Route.path>
        <Route.path Path="template2"></Route.path>
        <MyComponent1 Para1="..."></MyComponent1>
    </Route>
    <Route path="template3"> <!-- single template -->
        <MyComponent2 Para1="..." Para2="..."></MyComponent2>
    </Route>
    <Route> <!-- if a component set @page, we can ignore the path property of Route -->
        <MyComponent3 Para1="..."></MyComponent3>
    </Route>
    <Route> <!-- Not Found Route -->
        <MyNotFoundComponent Para1="..." Para2="..." Para3="..."></MyNotFoundComponent>
    </Route>
</Switch>

It performs like:

RenderFragment content = Url switch 
{
    var url when url.IsMatch("template1") || url.IsMatch("template2") => MyComponent1,
    var url when url.IsMatch("template3") => MyComponent2,
   _ => MyNotFoundComponent,
};

In this way, we can also put <Switch> in our own custom layout and apply layout to NotFoundContent.
With this, we can do more things. For example, we can store UserInfo in the Layout and define a function to fetch FetchUserInfo in the Layout, and we can pass the UserInfo and FetchUserInfo to some routed components, in the end we can display different contents based on the state of UserInfo and invokeFetchUserInfo() when necessary.

If we want to use automatically routing, we can write:

<Switch Assembly="typeof(Program).Assembly">
    <Route> <!-- Not Found Route -->
        <MyNotFoundComponent Para1="..." Para2="..."></MyNotFoundComponent>
    </Route>
</Switch>

Which appends the assemblies above the "Not Found Route", however, with this form we can only pass parameters from query to our routed components.

Additional context

It will solve #10445. And in my option it's a better solution comparing to #10493.

Or, if Blazor has a mechanism for state management (#5467), the above changes will be less necessary.

[SteveSandersonMS]

It's an interesting idea, @hez2010!

I'd recommend you implement this and see how well you feel it works in practice. As far as I'm aware, there's nothing to stop some <Switch> component like this from being implemented in application code (it doesn't have to be done in the framework repo).

If you find it's much better, you might want to publish it as a NuGet package so others can use it. In the long run if it becomes established that this is a better system, we might consider including it in the framework by default.

[SteveSandersonMS]

Closing as it's not something we plan to take action on in this repo in the immediate future, but marking as discussion. Please feel free to continue discussing here if you wish.

[hez2010]

@SteveSandersonMS I have implemented it at https://github.com/hez2010/BlazorRouter