navaid: Nested routes info and problem reproduction
I apologize in advance if I’m wrong to open the issue and I shouldn’t have done it here. But I think it really concerns the basics of Navaid.
I’m also ready to open and update a wiki page for all newcomers like me.
THE PROBLEM:
I started from svelte-demo (https://github.com/lukeed/svelte-demo) and I’m trying to use nested routes for a list/detail view.
REPRODUCTION: https://codesandbox.io/s/quizzical-dirac-2d0qy
To come to the problem you should:
- open the console from the tab on the bottom
- click on “Go to Teams Page”
- click on “Go to Team 1 Page” (or others)
- click on “Go to Team 1 Page” (or others) from the list
- as you can see in console until now just four messages from “App draw()” and one “PageTeamRoute draw()”
- now you can clear the console
- click on “Go to Player 1 Page” (or others) from the list
- you can see now the problem: 4 messages in console:
Why?
Am I correctly using Navaid with nested routes?
Is this correct in App.svelte?
.on("team/*", obj => draw(PageTeam, obj))
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 16 (9 by maintainers)
Commits related to this issue
- fix: relative links and non-root base paths (#21) - Closes #19, #13, #10 — committed to lukeed/navaid by lukeed 5 years ago
Well, you also have two handlers defined for every
team/*route.Once in the App and once in the PageTeam
Personally I would move everything up to the App router. Since you already have & known all the components ahead of time, to me, it doesn’t really make sense to sanction things off into units.
As of now, they’re all one App.
For me, the separate (sub)router approach make sense for when you are dynamically loading some variable set of widgets into your application, each of which will have their own routing needs. Aka, unknown, unrelated, and/or physically separate things. For example, in my mind, I’m thinking of a WordPress editor that loads in different content blocks from different authors, each of which has their own series of config/states tied to URL segments.
Since you’re developing all of this together, I would define the router together. Personally.
Now, after #12, you can keep this approach but remove
team/*from App. That is the redundant one but still fires on every URL change within that namespaceI’m pretty sure this is solved by #12 Navaid wasn’t initially meant to run
listen()multiple times within a page, but there’s probably good reason too now.You can follow the discussion there about current concerns/roadblocks.
Thanks for a very good repro!