我到处搜索过,但是找不到与我的用例匹配的解决方案。我想根据在地址栏中键入的信息使用动态URL进行API调用。
我正在执行以下操作:
${opt:stage}
SET_API_DATA提交:
${self:provider.stage}
,然后我要从与键入的URL匹配的API中获取数据,例如:apiUrl.com/Amsterdam/Pizza/get-a-pizza-for-5-dollar。
如何使用Nuxt将路由器导入Vuex,如何实现所需的行为?
我到处搜索过,但是找不到与我的用例匹配的解决方案。我想根据在地址栏中键入的信息使用动态URL进行API调用。
我正在执行以下操作:
${opt:stage}
SET_API_DATA提交:
${self:provider.stage}
,然后我要从与键入的URL匹配的API中获取数据,例如:apiUrl.com/Amsterdam/Pizza/get-a-pizza-for-5-dollar。
如何使用Nuxt将路由器导入Vuex,如何实现所需的行为?
首先,您需要检查文件夹结构是否正确设置为具有该数量的参数。查看文档=> https://nuxtjs.org/guide/routing
接下来,您可以将路由参数作为分派方法中的参数传递:
asyncData({ store,params }) {
store.dispatch('loadAPIData',{
city: params.city,company: params.company,dealSlug: params.dealSlug
})
},
在您的商店中,将有效负载作为第二个参数:
export const actions = {
loadAPIData({ commit },{city,company,dealSlug}) {
...
}
}
您可以在此处了解有关Vuex有效负载的更多信息=> https://vuex.vuejs.org/guide/actions.html#dispatching-actions