Hi everybody!
Little question, simple it seems... but i'm new
For a blog, on my sliceMachine, i created a Custom Type:
With theses fields:
On Prismic.io, i created 2 articles (with slug article-test-1 and article-test-2).
I'm trying to get theses paths:
/blog/:category/:uid
On my /blog/index.vue, i have:
<template>
<div class="section container-fluid blog">
<ul>
<ArticleListItem
v-for="article in articles"
:key="article.slug"
:article="article" />
</ul>
</div>
</template>
<script>
export default {
async asyncData({ $prismic, params, error }) {
const { results: articles } = await $prismic.api.query(
$prismic.predicate.at('document.type', 'article')
)
return {
articles
}
}
}
</script>
And the ArticleListItem component:
<template>
<div>
<PrismicLink :field="article" tab-index="-1">
{{ article.data.title }}
</PrismicLink>
</div>
</template>
<script>
export default {
props:[
'article'
]
}
</script>
Articles are displayed, but the link is wrong (no link in fact...).
I tried to write:
<PrismicLink :field="article.data.uid" tab-index="-1">
But articles aren't displayed anymore.
I looked at the nuxt-config, i tried to add a route:
prismic: {
endpoint: apiEndpoint,
modern: true,
apiOptions: {
routes: [
{
type: 'homepage',
path: '/',
},
{
type: 'page',
path: '/:category/:uid',
resolvers: {
category: 'category'
}
}
],
},
},
But it doesn't work either...
What i'm doing wrong?
Thanks a lot!
Vincent