Nuxt V3 getByUID trying to get documents from prismic but won't work

Developing with Prismic
1

Hello, i've been having some troubles with getByUID. I'm trying to get the document of a custom type but it won't work, here's the code:

<script setup>

const route = useRoute()
const slug = route.params.slug

const { client } = usePrismic()

const { data: proyecto } = await useAsyncData('proyecto', () => client.getByUID('proyecto', slug))
</script>

I'm sure the problem is not because of prismic installation as I managed to display some information from a Single Type in my index.

Here's the project: GitHub - Jaumo19/Boira-nuxt-3: Boira with Nuxt 3

2

Why's it not working?

I'd also recommend using your slug as the unique id for the call.

const { data: proyecto } = await useAsyncData(slug, () => client.getByUID('proyecto', slug))
console.log(proyecto.value)
3

Hello! The console log returns null. I'm sure it should work, im not sure what could be happening.

4

I think you need to set a UID field on the repeatable documents you're trying to fetch in Prismic as this is what you're trying to get. The second param of getByUID is expecting the UID of the document which it can't find. Slug is no longer recommended

In addition to the above you can also change your file name from [slug] to [uid] for good consistency with the Prismic eco system.

Then see if it works by:
const { data: proyecto } = await useAsyncData(route.params.uid, () => client.getByUID('proyecto', route.params.uid))

5

I renamed my .vue to [uid] as you said and also replaced all the slugs with uid's, however it's still not working. Here's my code:

<script setup>

const route = useRoute()

const { client } = usePrismic()

const { data: proyecto } = await useAsyncData(route.params.uid, () => client.getByUID('proyecto', route.params.uid))
console.log(proyecto.value)

</script>```
6

Can you post your custom type for this repeatable document? I can't see a UID field in your custom types
I'm expecting something like this under Main
"uid": { "type": "UID", "config": { "label": "Unique identifier" } },

Then in Prismic you should have a field like this:

Screenshot 2022-11-15 at 15.17.10
Screenshot 2022-11-15 at 15.17.101000×210 6.66 KB

7

Oh, I thought that adding the uid field in prismic wasn't necessary at all, I added it and now it works.
Thank you!

1 Like