title: NuxtJS - Cannot read property 'title' of undefined - Strange Behaviour
body: <p>I have a NuxtJS project linked to DatoCMS. A list of posts are displayed, click on a post title etc and get taken to the <code>_slug.vue</code> page displaying more information. When I click on the post title I get taken to the <code>_slug.vue</code> page, where I'm told 'Cannot read property 'title' of undefined'. However, if I refresh that page, it works fine. I can go back and forth between the homepage and the post page without any problems, <em>until I view a different post page</em>, and then the problem happens again until I reload the page. I can't work out what's going on.</p>
  
  <p><code>index.vue</code> in the Pages directory:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;main&gt;
          &lt;div v-for="(post, index) in allPosts" :key="index"&gt;
              &lt;div&gt;
                  &lt;h3&gt;Generic Header&lt;/h3&gt;
                  &lt;p&gt;Introduction paragraph&lt;/p&gt;
              &lt;/div&gt;
              &lt;div&gt;
                  &lt;div&gt;
                      &lt;div
                          v-for="(post, index) in allPosts"&gt;
                          &lt;ProductCard :post="post"/&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/main&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import ProductCard from "@/components/ProductCard";
  
  import gql from "graphql-tag";
  
  export default {
      components: {
          ProductCard
      },
      apollo: {
          allPosts: gql`
              {
                  allPosts {
                      title
                      text
                      slug
                  }
              }
          `
      }
  };
  &lt;/script&gt;
  
  </code></pre>
  
  <p>The <code>productCard.vue</code> component in the Components directory, which gets called above, has no code in the bottom script tag, just a nuxt-link to the <code>_slug.vue</code> file.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;nuxt-link :to="post.slug" prefetch&gt;{{ post.title }}&lt;/nuxt-link&gt;
  </code></pre>
  
  <p>The <code>_slug.vue</code> file:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;div&gt;
          &lt;h1&gt;{{ post.title }}&lt;/h1&gt;
          &lt;p&gt;{{ post.text }}&lt;/p&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import gql from "graphql-tag";
  export default {
      apollo: {
          post: {
              query: gql`
                  query Post($slug: String!) {
                      post(filter: { slug: { eq: $slug } }) {
                          title
                          text
                      }
                  }
              `,
              prefetch({ route }) {
                  return {
                      slug: route.params.slug
                  };
              },
              variables() {
                  return {
                      slug: this.$route.params.slug
                  };
              }
          }
      }
  };
  &lt;/script&gt;
  </code></pre>
  
  <p>This is the output from the console:</p>
  
  <pre><code>TypeError: Cannot read property 'title' of undefined
      at Proxy.render (webpack-internal:///./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./pages/_slug.vue?vue&amp;type=template&amp;id=286199e1&amp;:9)
      at VueComponent.Vue._render (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:3542)
      at VueComponent.updateComponent (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:4049)
      at Watcher.get (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:4473)
      at new Watcher (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:4462)
      at mountComponent (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:4067)
      at VueComponent.Vue.$mount (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:8405)
      at init (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:3115)
      at merged (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:3298)
      at createComponent (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:5968)
  </code></pre>
  
  <p>I have checked the other answers regarding 'Cannot read property 'title' of undefined' but they don't help in this instance, unfortunately.</p>
  
  <p>Many thanks with any help. 
  Matt</p>