Nuxt.js 本地站点页面仅在登陆时从 Strapi 加载数据，而不是通过 <nuxt-link> 导航

Posted 2023-03-10

【中文标题】Nuxt.js 本地站点页面仅在登陆时从 Strapi 加载数据，而不是通过 <nuxt-link> 导航

【英文标题】：Nuxt.js local site pages load data from Strapi only on landing, not navigating via <nuxt-link>

【发布时间】：2020-05-08 12:13:09

【问题描述】：

我正在使用来自 Strapi 的数据填充我的 Nuxt.js 网站。

我在 default.vue 布局中有我的导航，简单如：

  <li v-for="page in pages" :key="page.id">
    <nuxt-link :to="page.slug"></nuxt-link>
  </li>

url 正确呈现并尝试打开正确的页面，但是页面无法加载，因为它无法从 Strapi 加载数据，例如：

Cannot read property 'title' of undefined

如果我直接登陆页面或只是刷新它，所有内容都会正确加载。

因此，例如，登陆到 localhost:3000/about 可以正常工作，但导航到该页面却不行。

我想我首先缺少关于如何加载数据的一些东西。

我正在通过 Apollo 查询 default.vue 中的所有页面以获取导航

  apollo: 
    pages: 
      query: pagesQuery
    
  

而且只有index.vue里面的特定页面或者动态页面_slug.vue查询单个：

  apollo: 
    pages: 
      query: pageQuery,
      variables () 
        return 
          "slug": this.$route.params.slug
        
      
    

希望它很清楚，并提前感谢您的帮助！

【参考方案1】：

找到this similar question后，貌似解决办法是添加

 v-if="pages[0] != null"

在主要元素上，并且

  data() 
    return 
      pages: []
    
  

这似乎有效，但不确定是否有其他（更好的？）方法来处理它，所以请随时回复！

谢谢