Composables
useCraftUri
Learn how to use the useCraftUri composable.
This composable provides an easy way to retrieve the current URI based on the defined siteMap
within the nuxt.config.ts
.
It enhances multisite support and simplifies querying data from your Craft CMS backend.
Usage
const uri = useCraftUri();
By default it returns the uri based on the path
defined in the siteMap property in your nuxt.config.ts
. You can change this behavior by changing the
siteDetectionMode
to origin
. You can read more about that in the install docs.
siteDetectionMode: path
// Url: http://localhost:3000/de/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'path',
// siteMap: [
// {
// handle: 'en',
// origin: 'http://localhost:3000',
// path: '/',
// },
// {
// handle: 'de',
// origin: 'http://localhost:3000',
// path: '/de',
// }
// ],
// },
const uri = useCraftUri();
// uri.value will result in: "happy-trying"
siteDetectionMode: origin
// Url: https://en-site.ddev.site/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'origin',
// siteMap: [
// {
// handle: 'en',
// origin: 'https://en-site.ddev.site',
// path: '/',
// },
// {
// handle: 'en',
// origin: 'https://de-site.ddev.site',
// path: '/',
// }
// ],
// },
const uri = useCraftUri();
// uri.value will result in: "happy-trying"
Note
To use this composable, you have to define your sites in the siteMap
property in the nuxt.config.ts
.
Type
function useCraftCurrentSite(): ComputedRef<string>;