title: Gridsome - "category not defined on the instance but referenced during render"
body: <p>I am using the Gridsome blog starter, and I am trying to add a categories list above the posts:</p>
  <p>Below is the query. While it works as expected on the <code>/__explore</code>,
  on the app itself, I am getting the <code>error: vue.runtime.esm.js?2b0e:619 [Vue warn]: Property or method &quot;category&quot; is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option or for class-based components, by initializing the property.</code></p>
  <pre><code>&lt;page-query&gt;
  {
    metadata {
      sanityOptions {
        projectId
        dataset
      }
    }
    posts: allSanityPost(sortBy: &quot;publishedAt&quot;) {
      edges {
        node {
          id
          title
          slug {
            current
          }
          categories {
            id
            title
          }
          publishedAt(format: &quot;D. MMMM YYYY&quot;)
          _rawExcerpt
          mainImage {
            asset {
              _id
              url
            }
            caption
            alt
            hotspot {
              x
              y
              height
              width
            }
            crop {
              top
              bottom
              left
              right
            }
          }
        }
      }
    }
    categories: allSanityCategory(sortBy: &quot;publishedAt&quot;) {
      edges {
        node {
          id
          title
        }
      }
    }
  </code></pre>
  <p>With that error, It still displays, two categories, as expected, when I just fill it with &quot;a&quot;, instead of <code>{{category.title}}</code></p>
  <p>Thanks for your help.
  Avi.</p>