Question

我正在测试Nuxt，特别是如何为静态站点模式生成路由。部署到Netlify时，在部署日志中收到错误TypeError: blogRoutes is not iterable。这意味着什么，因为这两个请求的输出似乎都是简单字符串数组。任何帮助将不胜感激。

下面是一个稍微有些人为的示例，因为我正在两次致电Contentful，实际上这将是Shopify和Contentful。

generate: {
    routes: () => {
        const client = contentful.createClient(config)

        const blogRoutes = client
            .getEntries({
                content_type: 'blogPost'
            })
            .then(response => {
                return response.items.map(
                    entry => `/blog/${entry.fields.slug}`
                )
            })
        const collectionRoutes = client
            .getEntries({
                content_type: 'collection'
            })
            .then(response => {
                return response.items.map(
                    entry => `/collections/${entry.fields.slug}`
                )
            })
        const routes = [[...blogRoutes, ...collectionRoutes]]

        return routes
    }
}

Answer 1

blogRoutes和collectionRoutes都是promise，而不是数组。它们解析为数组（我假设），但是您需要等待它们，或者使用Promise.all（）。

还请注意，您似乎没有返回正确的data，而是要返回一个字符串数组，而不是一个字符串数组。

generate: {
    routes: async () => { // add async here
        const client = contentful.createClient(config)

        const blogRoutes = await client // add await here
            .getEntries({
                content_type: 'blogPost'
            })
            .then(response => {
                return response.items.map(
                    entry => `/blog/${entry.fields.slug}`
                )
            })
        const collectionRoutes = await client // add await here
            .getEntries({
                content_type: 'collection'
            })
            .then(response => {
                return response.items.map(
                    entry => `/collections/${entry.fields.slug}`
                )
            })

        const routes = [...blogRoutes, ...collectionRoutes] // return a single array of strings

        return routes
    }
}

Nuxt：TypeError：blogRoutes是不可迭代的

1 个答案: