Question

我的nuxtjs应用程序包含具有动态url的页面（实际上页面具有两个参数event-slug和event-id），然后在该页面的asyncData方法中，我从URL中提取了这些参数并用于axios个请求。当我单击事件列表中的一个项目（在另一个events-list页面上）时，此页面打开。当我触发nuxt generate命令时，我遇到错误，因为在生成静态页面时这些参数不可用。有什么解决办法吗？

解决方案（以防以后有人需要）：

假设我的Nuxt应用程序中有/event/:slug/:id条动态路由，并且需要为从后端收到的所有事件创建路由，请将此代码添加到nuxt.config.js中：

 generate: {
    routes: () => {
 axios.get('endpoint to get list of events')
        .then((response) => {
          // assume we received array of events in response.data
          let events = response.data;
          return events.map((event) => {
          
            // assume that my Nuxt dynamic route is /event/:slug/:id
            return `/event/${event.slug}/${event.id}`
          })
        })
    }
  },

Nuxt.js生成具有动态URL的页面

0 个答案: