# Basic dynamic routing - Nuxtjs

**URL:** <https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377>\
**Category:** Developing with Prismic\
**Tags:** nuxtjs\
**Created:** [October 17, 2022, 2:15pm UTC](https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377 "2022-10-17T14:15:40Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ducuingg](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/ducuingg/32/8110_2.png) [@ducuingg](https://community.prismic.io/u/ducuingg)\
**Post date:** [October 17, 2022, 2:15pm UTC](https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377/1 "2022-10-17T14:15:40Z")

</div>

Hi,

still learning, i'm trying to render a blog post named "article-1" which i created on my dashboard. I put an uid on it and i followed your doc but i have the error when i type : localhost:3000/article-1 :

 ![Capture d’écran 2022-10-17 à 16.13.21](https://europe1.discourse-cdn.com/flex013/uploads/prismic/original/2X/8/84192b7f131569584897d100cce5d36fd5a5c8c6.png)

This is my code \_uid.vue

```auto
<template>
  <div>
    <slice-zone type="blog" :uid="$route.params.uid" />
  </div>
</template>
  
  <script>
    import SliceZone from 'vue-slicezone'
  
    export default {
      components: {
        SliceZone,
      },
      async asyncData({ $prismic, params, error }) {
    const document = await $prismic.api.getByUID("blog", params.uid)
    if (document) {
      return { document }
    } else {
      error({ statusCode: 404, message: "Page not found" })
    }
  }
    }
  </script>type or paste code here

```

and finally my github link :

> **[GitHub - ducuingg/eniblock-exo-prismic](https://github.com/ducuingg/eniblock-exo-prismic)**
>
> Contribute to ducuingg/eniblock-exo-prismic development by creating an account on GitHub.

Thanks for your help !

---

<div class="post-metadata">

**Author:** ![Pau](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/pau/32/5422_2.png) [@Pau](https://community.prismic.io/u/Pau)\
**Post date:** [October 17, 2022, 8:38pm UTC](https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377/2 "2022-10-17T20:38:32Z")

</div>

Hey @ducuingg, seems like you're still using a deprecated package: [vue-slicezone](https://prismic.io/docs/technical-reference/vue-slicezone).

Now you can use `@prismicio/vue` instead:

> **[@prismicio/vue Technical Reference](https://prismic.io/docs/technical-reference/prismicio-vue)**
>
> @prismicio/vue is the official Prismic package for creating web apps with Prismic and Vue.js.

---

<div class="post-metadata">

**Author:** ![ducuingg](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/ducuingg/32/8110_2.png) [@ducuingg](https://community.prismic.io/u/ducuingg)\
**Post date:** [October 18, 2022, 7:34am UTC](https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377/4 "2022-10-18T07:34:08Z")

</div>

Thanks, the error message is gone but the content of my blog don't appear, can you tell me if something is wrong in my \_uid.vue ?

````auto
<template>
  <div class="content">
    <slice-zone type="blog" :uid="$route.params.uid" />
  </div>
</template>
  
  <script>
    import { SliceZone } from "@prismicio/vue";
  
    export default {
      components: {
        SliceZone,
      },
      async asyncData({ $prismic, params, error }) {
    const document = await $prismic.api.getByUID("blog", params.uid)
    console.log(document)
    if (document) {
      return { document }
    } else {
      error({ statusCode: 404, message: "Page not found" })
    }
  }
    }
  </script>
  
  <style scoped>
.content{
  margin-top:500px;
}
</style>```
````

---

<div class="post-metadata">

**Author:** ![jake](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/jake/32/5120_2.png) [@jake](https://community.prismic.io/u/jake)\
**Post date:** [October 18, 2022, 7:50am UTC](https://community.prismic.io/t/basic-dynamic-routing-nuxtjs/11377/5 "2022-10-18T07:50:08Z")

</div>

Hey Guillaume,

Try passing the SliceZone a prop of the document slices like:  
`<SliceZone :slices="document.data.body" />`

You may also need to pass the SliceZone an component object of your slices.  
like:  
`:components="defineSliceZoneComponents({ text: TextSlice, images: ImagesSlice, })`