Vue.js 为动态生成的nuxt页面选择布局

我正在构建一个项目，其中我的所有数据（包括页面路由）都来自GraphQL端点，但需要通过静态站点托管（我知道，我知道。不要让我开始）

我已经使用

numxt.config.js

中的以下代码从数据静态生成路由：

 generate: {
    routes: () => {
      const uri = 'http://localhost:4000/graphql'
      const apolloFetch = createApolloFetch({ uri })
      const query = `
          query Pages {
           pages {
            slug
            template
            pageContent {
             replaced
             components {
              componentName
              classes
             body
            }
          }
        }
      }
      `

      return apolloFetch({ query }) // all apolloFetch arguments are optional
        .then(result => {
          const { data } = result
          return data.pages.map(page => page.slug)
        })
        .catch(error => {
          console.log('got error')
          console.log(error)
        })
    }
  }

我试图解决的问题是，某些页面需要使用与默认页面不同的布局，要使用的正确布局在GraphQL数据中指定为

page.template

，但我看不到任何方法将该信息传递给路由器

我已尝试将

返回数据.pages.map（page=>page.slug）

更改为：

  return data.pages.map(page => {
     route: page.slug,
     layout: page.template
    })

---

但这似乎不是一个开始。有人知道如何将布局首选项传递给vue路由器吗？

一种方法是将数据注入有效负载

---

这将允许您将生成信息传递到路由本身

在文档中，它说：“动态路由被generate命令忽略：”-但这只是一个疯狂的猜测-你找到解决方案了吗？这就是我最后要做的：）然后，当下一个问题出现时，我说‘去它的’，然后切换到Gatsby.：）你考虑过一些吗？