diff --git a/src/content/docs/en/reference/routing-reference.mdx b/src/content/docs/en/reference/routing-reference.mdx index 3b304a94ae29c..39882014a6cda 100644 --- a/src/content/docs/en/reference/routing-reference.mdx +++ b/src/content/docs/en/reference/routing-reference.mdx @@ -170,6 +170,41 @@ const { post } = Astro.props;

{id}: {post.name}

``` +### `routePattern` + +

+ +**Type:** `string`
+ +

+ +A property available in [`getStaticPaths()`](#getstaticpaths) options to access the current [`routePattern`](/en/reference/api-reference/#routepattern) as a string. + +This provides data from the [Astro render context](/en/reference/api-reference/) that would not otherwise be available within the scope of `getStaticPaths()` and can be useful to calculate the `params` and `props` for each page route. + +`routePattern` always reflects the original dynamic segment definition in the file path (e.g. `/[...locale]/[files]/[slug]`), unlike `params`, which are explicit values for a page (e.g. `/fr/fichiers/article-1/`). + +The following example shows how to localize your route segments and return an array of static paths by passing `routePattern` to a custom `getLocalizedData()` helper function. The [params](https://github.com/en/reference/routing-reference/#params) object will be set with explicit values for each route segment: `locale`, `files`, and `slug`. Then, these values will be used to generate the routes and can be used in your page template via `Astro.params`. + + +```astro title="src/pages/[...locale]/[files]/[slug].astro" "routePattern" "getLocalizedData" +--- +import { getLocalizedData } from "../../../utils/i18n"; + +export async function getStaticPaths({ routePattern }) { + const response = await fetch('...'); + const data = await response.json(); + + console.log(routePattern); // [...locale]/[files]/[slug] + + // Call your custom helper with `routePattern` to generate the static paths + return data.flatMap((file) => getLocalizedData(file, routePattern)); +} + +const { locale, files, slug } = Astro.params; +--- +``` + ### `paginate()`