Why not use basename= for nested routers?

[m-kuzmin]

I am working on an app that really is 2 completely separate subapps (or maybe more in the future). They can function independently and do not need to be aware of each other. They do integrate with each other, but that is besides the point.

I looked at the example in Concepts: Router and thought that what is proposed there, mainly doing a #[at("/settings/stuff")] is just weird. Both of my subapps have all their #[at()]s stating at /, not /subapp1 or /subapp2.

The way I route everything in the root component is each subapp takes a basename in it's props and applies it to it's router.

My question is, are there any pifalls with this apart from the obvious thing where you need to pass in basenames of other apps so cross-app <Link>s work?

Here's some pseudo-yew:

enum Root {
  #[at("/")]
  Home,

  #[at("/sub1")]
  Sub1Root,
  #[at("/sub1/*")]
  Sub1,
}

fn route() {
  match route {
    Home => html!{ <Root /> },
    Sub1 | Sub1Root => html!{ <Sub1 basename="/sub1" /> },
  }
}

#[function_component]
fn Sub1({ basename }) {
  html! {
    <BrowserRouter { basename }>
    ...
  }
}