nested routes not update
Closed this issue · 10 comments
https://codesandbox.io/s/rturnq-solid-router-nested-twv4q
is this correct way to write nested routes. but nested routes not update on link change.
That is almost correct. You only need one RouterProvider
component at the root of your application. If you remove the second one from your example, it will work. Every MatchRoute
and ShowRoute
component creates a new route context which will provide a base path for subsequent Link
, MatchRoute
and ShowRoute
components.
Additionally, you may want to consolidate the two Switch
components you have in your "child" route from:
<Switch>
<MatchRoute path="first">First</MatchRoute>
</Switch>
<Switch>
<MatchRoute path="second">Second</MatchRoute>
</Switch>
to:
<Switch>
<MatchRoute path="first">First</MatchRoute>
<MatchRoute path="second">Second</MatchRoute>
</Switch>
It shouldn't cause a problem but it is harder to read and is likely a little less performant. If those semantics were intentional, you can get the same behavior using the ShowRoute
component instead:
<ShowRoute path="first">First</ShowRoute>
<ShowRoute path="second">Second</ShowRoute>
In this case both routes would never show at the same time, but other cases where the paths are not exclusive would.
Thank you so much. It works perfect.
when i have NavLink
with different pages it does not update component when one page is already open:
<MatchRoute path="/page/:page">
I'm not sure what you are asking. Would you provide a small example and explain what your expected outcome is versus what you are observing?
The NavLink
component is just a wrapper around the Link
component which tests its href
prop against the current route and passes a class ("is-active" by default) to the underlying Link
component when it matches. If you want it to change style when active you will need to implement the css for .is-active
or whatever value you use if you set the activeClass prop.
I have a route for common pages:
<MatchRoute path="/page/:page">
when i navigate from page/1
to page/2
the route component does not update
Hmm, interesting. It looks like there are a couple issues here which separately affect using both the render function form of a MatchRoute
or ShowRoute
and the child component form. I've fixed both issues and published a new beta version 0.1.4-beta1
which is also tagged beta
. I also threw together an example which I was using to validate: https://codesandbox.io/s/rturnq-solid-router-nested-eb7tj.
Thanks for testing the functionality and pointing out this issue.
Thank you so much. please push changes to github too.
Whoops, forgot to push - late night deployments. Its on the development
branch now.
Thank you so much. Its working perfect.
Glad to hear it.