从多个数据源构建 Nuxt 站点地图

Question

我正在 SSR 模式下使用 Nuxt，并希望为多个路线/数据集构建动态站点地图。

我现在面临的问题是 async/await 函数只允许“data”作为变量。使用“post”作为变量的相同函数会导致“地图函数不存在”

这是我的 Nuxt.config.js 文件中的内容

  sitemap: {

    hostname: "https://example.com",

    routes: async () => {

      let { data } = await axios.get('https://api.example.com/api/v1/locations');

      data = data.data.map((loc) => `/locations/${loc.slug}`);

      console.log(data);

      let { posts } = await axios.get('https://cms.example.com/wp-json/wp/v2/posts');

      posts = posts.map((post) => `/posts/${post.slug}`);

      console.log(posts);

      data.concat(posts);

      return data

    },

    path: '/sitemap.xml'

  }

我正在寻找的结果输出应采用如下格式：

[

  '/locations/location-one',

  '/locations/location-two',

  '/locations/location-three',

  '/posts/post-one',

  '/posts/post-two',

  '/posts/post-three',

]

我收到的错误：

Cannot read property 'map' of undefined

它发生在这条线上：

posts = posts.map((post) => `/posts/${post.slug}`)

所以在我看来，它不接受“posts”作为其自己的等待函数的有效变量。

当第一个调用被注释掉并且使用“数据”而不是“帖子”时，该调用工作正常

Answer 1

你的解构反应是错误的：代替：let { posts } = ...经过：let { data: posts } = ...因为 Axios 总是返回一个“data”属性，所以你只需将其重命名为“posts”即可。

Answer 2

你的数组串联必须是这样的：data.concat(posts);该push()方法仅推送一项，而不是推送一组项目。