Nuxtjs 页面中的异步等待在页面刷新时不起作用

Question

我尝试使用 vuex 和 nuxt js 在我的页面的获取方法中获取数据，但每当有人刷新页面时它都会失败，但当我浏览 nuxt 导航时可以工作

所以在我的页面中，我有

fetch ({ store, params }) {
store.dispatch('getJobspecialisims')
},
//IVE ALSO TRIED ASYNC
async asyncData (context) {
await context.store.dispatch('getJobspecialisims');
},

所以在我的 vuex 动作中，我有

async getJobspecialisims({commit}){
await axios.get(process.env.baseUrl+'/job-specialisims').then((res)=>{
commit(types.SET_JOB_SPECIALISIMS, res.data.data)
},(err)=>{
console.log("an error occured ", err);
});
},

现在在我的组件上获取记录

<div>
<li v-for="(specialisim) in $store.getters.jobspecialisims">
<!-DO STUFF HERE->   
</li>

当某人刷新浏览器时，永远不会发送 http 请求

我哪里出错了？ 我更喜欢异步等待方法。我发现它返回了一个承诺，但我不知道如何知道承诺何时解决。页面应该始终等待，直到数据完全被提取，因此在我的页面中称为获取或异步数据方法

我还需要添加或修改什么？

Answer 1

对于异步操作，当您在fetch或asyncData中调用它时，您需要将return放在调度之前：

fetch ({ store, params }) {
// store.dispatch('getJobspecialisims')
return store.dispatch('getJobspecialisims')
},

此答案的来源：问题：Vuex 操作，从页面调度

反正我还是不明白你为什么用了那个。如果我，我将像这样使用异步等待：

async getJobspecialisims({ commit }) {
const res = await axios.get(YOUR_URL);
if (!res.error) {
commit("getJobspecialisims", res.data.data);
} else {
console.log(res.error);
}
}