Skip to content

Commit 58bb0ce

Browse files
committed
Add note about route precedence
Fixes #1921
1 parent 04736e6 commit 58bb0ce

File tree

2 files changed

+15
-9
lines changed

2 files changed

+15
-9
lines changed

docs/api/Redirect.md

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -31,16 +31,12 @@ specify them if you need to.
3131
</Route>
3232
```
3333

34-
Note that the `<Redirect/>` can be placed anywhere in the route
35-
hierarchy, if you'd prefer the redirects to be next to their respective
36-
routes, the `from` path will match the same as a regular route `path`.
37-
Currently, the `to` property of `<Redirect/>` needs to be an absolute
38-
path. Pull requests welcome to make them handle relative paths too!
34+
Note that the `<Redirect/>` can be placed anywhere in the route hierarchy, though [normal precedence](../basics/RouteMatching.md#precedence) rules apply. If you'd prefer the redirects to be next to their respective routes, the `from` path will match the same as a regular route `path`. Currently, the `to` property of `<Redirect/>` needs to be an absolute path. Pull requests welcome to make them handle relative paths too!
3935

4036
```js
4137
<Route path="course/:courseId">
4238
<Route path="dashboard"/>
4339
{/* /course/123/home -> /course/123/dashboard */}
4440
<Redirect from="home" to="/course/:courseId/dashboard" />
4541
</Route>
46-
```
42+
```

docs/basics/RouteMatching.md

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
# Route Matching
22

3-
A [route](/docs/Glossary.md#route) has two attributes that determine whether or not it "matches" the URL:
3+
A [route](/docs/Glossary.md#route) has three attributes that determine whether or not it "matches" the URL:
44

55
1. [nesting](#nesting) and
66
2. its [`path`](#path-syntax)
7+
3. its [precedence](#precedence)
78

89
### Nesting
910

@@ -17,10 +18,19 @@ A route path is [a string pattern](/docs/Glossary.md#routepattern) that is used
1718
- `()` – Wraps a portion of the URL that is optional
1819
- `*` – Matches all characters (non-greedy) up to the next character in the pattern, or to the end of the URL if there is none, and creates a `splat` [param](/docs/Glossary.md#params)
1920

20-
```
21+
```js
2122
<Route path="/hello/:name"> // matches /hello/michael and /hello/ryan
2223
<Route path="/hello(/:name)"> // matches /hello, /hello/michael, and /hello/ryan
2324
<Route path="/files/*.*"> // matches /files/hello.jpg and /files/path/to/hello.jpg
2425
```
2526

26-
If a route uses a relative `path`, it builds upon the accumulated `path` of its ancestors. Nested routes may opt-out of this behavior by [using an absolute `path`](RouteConfiguration.md#decoupling-the-ui-from-the-url).
27+
If a route uses a relative `path`, it builds upon the accumulated `path` of its ancestors. Nested routes may opt-out of this behavior by [using an absolute `path`](RouteConfiguration.md#decoupling-the-ui-from-the-url).
28+
29+
### Precedence
30+
31+
Finally, the routing algorithm attempts to match routes in the order they are defined, top to bottom. So, when you have two sibling routes you should be sure the first doesn't match all possible `path`s that can be matched by the later sibling. For example, **don't** do this:
32+
33+
```js
34+
<Route path="/comments" ... />
35+
<Redirect from="/comments" ... />
36+
```

0 commit comments

Comments
 (0)