我正在使用Nuxt.js
,并且正在使用我的nuxt.config.js
文件将我的动态页面路由生成为静态页面。
我在本地使用静态products.json
文件,而不是在静态文件夹中使用API。我现在可以静态生成动态路由列表
nuxt.config.js文件
import servers from './static/servers.json'
const dedicatedServers = () => {
return new Promise(resolve => {
resolve(servers.dedicatedServers.map(server => `/products/dedicated-servers/${server.id}`))
})
}
generate: {
routes: dedicatedServers
}
现在如何向我的生成对象添加更多产品类别?
我尝试添加一个数组,但是在路由上不起作用:
generate:{routes:[dedicatedServers,cloud-servers]}//does not work
我现在尝试制作一个新方法并返回此方法,但这也不起作用。
nuxt.config.js-不起作用
import servers from './static/servers.json'
const dynamicRoutes = async() => {
let dedicatedServers = () => {
return new Promise(resolve => {
resolve(servers.dedicatedServers.map(server => `/products/dedicated-servers/${server.id}`))
})
}
const cloudServers = () => {
return new Promise(resolve => {
resolve(servers.cloudServers.map(server => `/products/cloud-servers/${server.id}`))
})
}
const routes = dedicatedServers;
return routes;
}
generate: {
routes: dynamicRoutes
}
我设法通过从generate对象返回promise来创建多个类别,在该对象中我映射了变量中的每个类别。
generate: {
routes: function () {
let dedicatedServers = servers.dedicatedServers.map(server => `/products/dedicated-servers/${server.id}`)
let cloudServers = servers.cloudServers.map(server => `/products/cloud-servers/${server.id}`)
return Promise.all([dedicatedServers, cloudServers]).then(values => {
return values.join().split(',');
})
}
}