从nuxt中间件向vuex商店发送多个API请求的方法如下:
npm install axios
import axios from 'axios';
export default function ({ store }) {
return axios.all([
axios.get('api-url-1'),
axios.get('api-url-2'),
axios.get('api-url-3')
])
.then(axios.spread((response1, response2, response3) => {
// 处理每个API请求的响应数据
store.commit('mutation1', response1.data);
store.commit('mutation2', response2.data);
store.commit('mutation3', response3.data);
}))
.catch(error => {
console.error(error);
});
}
export const mutations = {
mutation1(state, data) {
state.data1 = data;
},
mutation2(state, data) {
state.data2 = data;
},
mutation3(state, data) {
state.data3 = data;
}
};
export default {
computed: {
data1() {
return this.$store.getters['module/mutation1'];
},
data2() {
return this.$store.getters['module/mutation2'];
},
data3() {
return this.$store.getters['module/mutation3'];
}
}
};
以上代码示例中,'module'是vuex模块的名称,需要根据实际情况进行修改。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)、腾讯云对象存储(COS)、腾讯云云数据库MySQL(CDB)等。您可以通过腾讯云官方网站获取更多关于这些产品的详细信息和文档。
腾讯云官方网站:https://cloud.tencent.com/
领取专属 10元无门槛券
手把手带您无忧上云