Create a nested router possible?

[aWeinzierl]

The documentation shows how to create nested routes.
However, it doesn't show how to nest Router components.

Is it already possible to nest routers?

If so, how?

[arctic-hen7]

From my understanding, the general idea of the Router component is that you only have one in your app. If you were to nest them, which router would control which page transition? I'm struggling to think of a use case in which you would ever need more than one router, what exactly do you have in mind?

Usually, what you would do is just define all your routes in one enum (as is documented) and then provide that to the router. Then, it will automatically pick up any links in your app to internal pages (e.g. an anchor element with href = "about") and prevent the default browser behavior of loading the new page, instead just replacing the View, reducing the number of requests that need to be made to the server (because all the necessary information is contained in the Wasm bundle that runs your app).

[aWeinzierl]

I certainly don't doubt it would not be possible with just one router. However, I thought about having nested ones (or routing handlers) to distribute routing across multiple more complex components of the app, e.g. have one high level router that routes to a complex component, which then handles its routes for itself.
(component is not referring to Sycamore terminology)

What's the reasoning to only react to anchor tags within the router though, especially considering the app would only have one global router?

[arctic-hen7]

Because anchor tags are the usual way to manage links in HTML. If you need to trigger the switch to a route imperatively, you can always use navigate().

Each section of your app should call out to the global router to avoid what would probably be a lot of reactive scope management hell under the hood if multiple routers were allowed. If you really needed this though, I suppose you could host the complex parts as independent Sycamore sites at relative URL paths, but then a global router that unified them all wouldn't be possible.

[aWeinzierl]

Because anchor tags are the usual way to manage links in HTML.

I think I was misunderstood. I meant "why only anchor tags within the router, not why anchor tags were chosen.

Each section of your app should call out to the global router to avoid what would probably be a lot of reactive scope management hell under the hood if multiple routers were allowed.

Yeah, I can see that. Angular solved this by having a global router where multiple parts of the app can register routes: https://angular.io/api/router/RouterModule

[arctic-hen7]

Ah, I would assume because it's theoretically possible for a Sycamore app to be embedded in another framework's app, in which case this behavior wouldn't be desired. Also, it's designed to go at the root of the app, so this behavior ends up happening anyway in the typical usage.

As for the Angular approach, I think there could well be some things Sycamore could learn from that, so you could open an issue if you think there's anything specific that should be added.

[lukechu10]

Nested routes are not the same as nested Router components. Nested routes basically combine multiple route enums into one single route enum which can be used in a single Router.

[AmyYummy]

It's Ok.
If router IP address is192.168.0.1
Change your routing ip to the 192.168.0 network segment
such as changing to192.168.0.10
Then enable your dhcp and wireless functions.

Amy Baudom