Skip to content

Commit 6eef898

Browse files
bitveratilafassinakodiakhq[bot]
authored
Create use-resolved-path.mdx (#676)
Co-authored-by: Atila Fassina <atila@fassina.eu> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
1 parent a5ed55d commit 6eef898

File tree

1 file changed

+37
-0
lines changed

1 file changed

+37
-0
lines changed
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
---
2+
title: useResolvedPath
3+
---
4+
5+
`useResolvedPath` retrieves a signal\<string\>.
6+
It contains the current resolved path as defined in the Route.
7+
8+
```js
9+
const path = useResolvedPath(() => '');
10+
11+
// Parent Route path: /user/*
12+
console.log(path()); // /user
13+
14+
const path = useResolvedPath(() => 'a/b/c');
15+
16+
// Parent Route path: /user/*
17+
console.log(path()); // /user/a/b/c
18+
19+
const path = useResolvedPath(() => '/a/b/c'); // Note: /
20+
21+
// Parent Route path: /user/*
22+
console.log(path()); // a/b/c
23+
```
24+
25+
Useful for making modular routers
26+
27+
```js
28+
const parentRoutePath = useResolvedPath(() => '');
29+
30+
return <>
31+
<h1>Module component layer</h1>
32+
<Router base={parentRoutePath()}> // Modular magic
33+
<Route path="/" component={() => <div>Index</div>}/>
34+
<Route path="/a" component={() => <div>AComponent</div>}/>
35+
</Router>
36+
</>
37+
```

0 commit comments

Comments
 (0)