Can't render a route and its parent (Outlet concept)
amglt opened this issue · 1 comments
Describe the bug
I can't render a route and its parent, comparison to the outlet concept of react-router
To Reproduce Steps to reproduce the behavior:
<Router>
<Route path="/*" component={Layout}>
<Route path="pvp" component={Pvp} />
</Route>
</Router>
Navigating to /pvp will render Layout correctly but won't render Pvp at all
Desktop (please complete the following information):
- OS: Windows 10
- Browser: Chrome
- Version 3.1.5
Additional context
Maybe I just didn't understand if it's possible and how to do it
The reason the Pvp
component is not rendered is because you supplied both a component
prop to the parent route as well as a child. In that case svelte-navigator
will always favor the component
prop. A little modification should fix your problem:
<Router>
<Route path="/*">
<Layout>
<Route path="pvp" component={Pvp} />
</Layout>
</Route>
</Router>
Note that svelte-navigator
does not have the concept of an Outlet
. If you want some parts of the ui to always be shown, you'll need to move them out of the encapsulating Route
instead.