You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/route/route.md
+33Lines changed: 33 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -136,6 +136,39 @@ function Product() {
136
136
}
137
137
```
138
138
139
+
### Optional Segments
140
+
141
+
You can make a route segment optional by adding a `?` to the end of the segment.
142
+
143
+
```tsx
144
+
<Route
145
+
// this path will match URLs like
146
+
// - /categories
147
+
// - /en/categories
148
+
// - /fr/categories
149
+
path="/:lang?/categories"
150
+
// the matching param might be available to the loader
151
+
loader={({ params }) => {
152
+
console.log(params["*"]); // "one/two"
153
+
}}
154
+
// and the action
155
+
action={({ params }) => {}}
156
+
element={<Categories />}
157
+
/>;
158
+
159
+
// and the element through `useParams`
160
+
function Categories() {
161
+
let params =useParams();
162
+
console.log(params.lang);
163
+
}
164
+
```
165
+
166
+
You can have optional static segments, too:
167
+
168
+
```jsx
169
+
<Route path="/project/task?/:taskId"/>
170
+
```
171
+
139
172
### Splats
140
173
141
174
Also known as "catchall" and "star" segments. If a route path pattern ends with `/*` then it will match any characters following the `/`, including other `/` characters.
0 commit comments