Slice-zone return nothing

Developing with Prismic
1

In my vue-nuxt page this slice-zone not working

<template>
  <div class="container">
    <div>
      {{page}}
      <!-- <slice-zone type="home" uid="app" /> -->
      <slice-zone type="{home}" :slices="page.data.body1" />

      <Logo />
      <h1 class="title">prismic-p1</h1>
      <div class="links">
        <a
          href="https://nuxtjs.org/"
          target="_blank"
          rel="noopener noreferrer"
          class="button--green"
        >
          Documentation
        </a>
        <a
          href="https://github.com/nuxt/nuxt.js"
          target="_blank"
          rel="noopener noreferrer"
          class="button--grey"
        >
          GitHub
        </a>
      </div>
    </div>
  </div>
</template>

<script>
import SliceZone from "vue-slicezone";
export default {
   async asyncData({$prismic }) {
    return {
        page: await $prismic.api.getByUID('home', 'home_page')
      }
  },
  data() {
    return {
      components: {
        SliceZone,

      },
      headerData: {},

    };
  },
  methods: {
    resolver({ sliceName, slice, i }) {
      return Slices[sliceName];
    },
  },
};
</script>
3

Hi Mano,

Welcome to the Prismic community.

I have looked at the code snippet you have shared with us, and may I know what you are trying to achieve?
In fact, I don't understand why you are passing the {home} as props in

<slice-zone type="{home}" :slices="page.data.body1" />
Also, in Nuxt sliceZone, you can automatically fetch your slices, and all you need is to provide the type and the UID.

For more information, please refer to those documentations.

It would be useful to us to share the repository name that you are querying (in a private message if necessary).

Looking forward to your reply,
Fares

4

Hi @codehat, can you copy-paste the JSON model of your slice here?

5

This thread has been closed due to inactivity. Flag to reopen.