Skip to content

Commit 1e74950

Browse files
authored
docs: Clarify prefixed link href with localePrefix: 'as-needed' (#1808)
[Ref](#1807)
1 parent 7cd9ee1 commit 1e74950

File tree

2 files changed

+25
-2
lines changed

2 files changed

+25
-2
lines changed

docs/src/pages/docs/routing.mdx

+3-2
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export const routing = defineRouting({
6565

6666
#### `localePrefix: 'as-needed'` [#locale-prefix-as-needed]
6767

68-
If you want to use no prefix for the default locale (e.g. `/about`), you can configure your routing accordingly:
68+
If you want to use no prefix for the default locale (e.g. `/about`) while keeping it for other locales (e.g. `/de/about`), you can configure your routing accordingly:
6969

7070
```tsx filename="routing.ts" {5}
7171
import {defineRouting} from 'next-intl/routing';
@@ -79,7 +79,8 @@ export const routing = defineRouting({
7979
**Note that:**
8080

8181
1. If you use this routing strategy, make sure that your [middleware matcher](/docs/routing/middleware#matcher-config) detects unprefixed pathnames.
82-
2. If a superfluous locale prefix like `/en/about` is requested, the middleware will automatically redirect to the unprefixed version `/about`. This can be helpful in case you're redirecting from another locale and you want to update a potential cookie value first (e.g. [`<Link />`](/docs/routing/navigation#link) relies on this mechanism).
82+
2. The middleware will by default set a [cookie](#locale-cookie) to remember the user's locale preference. If no explicit locale prefix is present in the pathname, then [locale detection](/docs/routing/middleware#locale-detection-prefix) will potentially redirect users to the latest locale that was matched based on the cookie value (e.g. `/``/de`).
83+
3. If a superfluous locale prefix like `/en/about` is requested, the middleware will automatically redirect to the unprefixed version `/about`. This can be helpful in case you're redirecting from another locale and you want to update a potential cookie value first (e.g. [`<Link />`](/docs/routing/navigation#link) relies on this mechanism).
8384

8485
#### `localePrefix: 'never'` [#locale-prefix-never]
8586

docs/src/pages/docs/routing/navigation.mdx

+22
Original file line numberDiff line numberDiff line change
@@ -152,6 +152,28 @@ In case you're using the [`pathnames`](/docs/routing#pathnames) setting, the `hr
152152

153153
</Details>
154154

155+
<Details id="link-locale">
156+
<summary>Why does `<Link />` always set a locale prefix when using the `locale` prop?</summary>
157+
158+
If you're providing a `locale` prop, typically to change the locale of the target page, you might notice that the link's `href` will always include a locale prefix, even if you're using a [`localePrefix`](/docs/routing#locale-prefix) setting other than `always`.
159+
160+
**Example:**
161+
162+
If you're using [`localePrefix: 'as-needed'`](/docs/routing#locale-prefix-as-needed) and `en` is your default locale, then the `href` for this link will still be `/en/about`:
163+
164+
```tsx
165+
// Links to `/en/about`
166+
<Link href="/about" locale="en">
167+
About
168+
</Link>
169+
```
170+
171+
The reason for this is that a potential [cookie](/docs/routing#locale-cookie) may need to be updated before the user can visit the unprefixed route at `/about`. The prefixed pathname will take care of this and will subsequently redirect to the unprefixed route. This behavior is necessary because links might be interacted with before your page is hydrated and client-side code would have a chance to update the cookie.
172+
173+
If you'd like to avoid this behavior, you can instead use [`useRouter`](#userouter) to switch the locale, which can rely on updating the cookie on the client side before navigating to the target page.
174+
175+
</Details>
176+
155177
<Details id="link-unknown-routes">
156178
<summary>How can I link to unknown routes when using the `pathnames` setting?</summary>
157179

0 commit comments

Comments
 (0)