- Support for optional path segments (#9650)
- You can now denote optional path segments with a
?
as the last character in a path segment - Optional params examples
:lang?/about
will get expanded and match:/:lang/about
/about
/multistep/:widget1?/widget2?/widget3?
will get expanded and match:/multistep/:widget1/:widget2/:widget3
/multistep/:widget1/:widget2
/multistep/:widget1
/multistep
- Optional static segment example
/fr?/about
will get expanded and match:/fr/about
/about
- You can now denote optional path segments with a
- Stop incorrectly matching on partial named parameters, i.e.
<Route path="prefix-:param">
, to align with how splat parameters work. If you were previously relying on this behavior then it's recommended to extract the static portion of the path at theuseParams
call site: (#9506)
// Old behavior at URL /prefix-123
<Route path="prefix-:id" element={<Comp /> }>
function Comp() {
let params = useParams(); // { id: '123' }
let id = params.id; // "123"
...
}
// New behavior at URL /prefix-123
<Route path=":id" element={<Comp /> }>
function Comp() {
let params = useParams(); // { id: 'prefix-123' }
let id = params.id.replace(/^prefix-/, ''); // "123"
...
}
- Updated dependencies:
@remix-run/router@1.1.0-pre.0
- Updated dependencies:
@remix-run/router@1.0.5
- Updated dependencies:
@remix-run/router@1.0.4
useRoutes
should be able to returnnull
when passinglocationArg
(#9485)- fix
initialEntries
type increateMemoryRouter
(#9498) - Updated dependencies:
@remix-run/router@1.0.3
- Fix
IndexRouteObject
andNonIndexRouteObject
types to makehasErrorElement
optional (#9394) - Enhance console error messages for invalid usage of data router hooks (#9311)
- If an index route has children, it will result in a runtime error. We have strengthened our
RouteObject
/RouteProps
types to surface the error in TypeScript. (#9366) - Updated dependencies:
@remix-run/router@1.0.2
- Preserve state from
initialEntries
(#9288) - Updated dependencies:
@remix-run/router@1.0.1
Whoa this is a big one! 6.4.0
brings all the data loading and mutation APIs over from Remix. Here's a quick high level overview, but it's recommended you go check out the docs, especially the feature overview and the tutorial.
New APIs
- Create your router with
createMemoryRouter
- Render your router with
<RouterProvider>
- Load data with a Route
loader
and mutate with a Routeaction
- Handle errors with Route
errorElement
- Defer non-critical data with
defer
andAwait
Bug Fixes
- Path resolution is now trailing slash agnostic (#8861)
useLocation
returns the scoped location inside a<Routes location>
component (#9094)
Updated Dependencies
@remix-run/router@1.0.0