useStatamicPageUri
A composable for generating the URI of the current Statamic page.
Added since: v1.0.0
Last changed:
Usage
The useStatamicPageUri composable is used to generate the URI of the current Statamic page.
It will handle i18n locale prefixes by stripping them from the route path before generating the page URI, ensuring consistent page URIs across different locales. It will also remove trailing slashes to prevent API failures.
Internal example
runtime/composables/useStatamicPage.ts
export function useStatamicPage<T extends Record<string, any> = StatamicApiEntryDefaultFields>(
options?: {
uri?: string;
fetchOptions?: AsyncDataOptions<T>;
},
): AsyncData<T, NuxtError> {
const api = useStatamicApi();
const uri = useStatamicPageUri(options?.uri);
return useAsyncData(
useStatamicCacheKey("page", uri),
() => api.entryByUri<T>({ uri: uri.value }, {
...options?.fetchOptions,
...mergeFetchHooks({
onResponse: ({ response }: Record<string, any>) => {
if (!response._data) {
throw createError({
fatal: true,
statusCode: 404,
statusMessage: `Page not found \`${uri.value}\``,
data: {
name: "PAGE_NOT_FOUND",
},
});
}
},
}, options?.fetchOptions as any || {}),
}),
) as AsyncData<T, NuxtError>;
}
Type Definition
function useStatamicPageUri(
uri?: MaybeRefOrGetter<string>,
): ComputedRef<string>
API Reference
Params
uri
MaybeRefOrGetter<string>
The URI of the page to fetch
Return Value
ComputedRef<string>
The computed reference to the page URI.
The URI is generated based on the route URI and i18n locale.