使用graphQL的Nuxt动态路由填充

在nuxtconfig.js中，您可以使用 生成：{routes（）{}

返回应用程序的所有动态路由

所有示例都使用axios ie：

import axios from 'axios'

export default {
  generate: {
    routes: function () {
      return axios.get('https://my-api/users')
      .then((res) => {
        return res.data.map((user) => {
          return {
            route: '/users/' + user.id,
            payload: user
          }
        })
      })
    }
  }
}

我如何使用graphQL/apollo实现这一点

我试过这个和其他一些组合

let v
  apollo: {
    posts: {
      query: gql`
        query posts {
          posts {
            title
          }
        }
      `,
      result({ data, loading, networkStatus }) {
        v = data
      }
    }
  },

  generate: {
    subFolders: true,
    routes: function() {
      return {
        route: '/posts/' + v.title,
        payload: v
      }
    }
  },

错误是我认为apollo不能用于nuxtconfig

这也不起作用

  generate: {
    routes: function() {
      apollo: {
        posts: {
         query:`query posts {
           posts {
            title
          }
        }
      `,
      result({ data, loading, networkStatus }) {
       return {
        route: '/posts/' + data.title,
        payload: data
       }
      }
    }
  },

    }
  },

---

这里可能发生的情况是阿波罗舱在建造期间没有初始化，因此

v

从未填充。相反，您需要从

routes

函数内部进行GraphQL查询。我也尝试过，将apollo查询放在routes函数中。似乎阿波罗并不是以我尝试过的每一种方式在nuxtconfig中运行。我最终用Axios heh实现了GrapQLAPI。