您的位置:首页 > 产品设计 > UI/UE

在vuex的store中如何正确的通过axios进行请求操作获取数据

2017-12-30 14:59 821 查看

具体描述

在项目中遇到vuex的store中直接使用this.$axios或者Vue.axios无法正确进行axios进行请求操作获取数据的

原因

在平时组件中能使用this.axios(通过Vue.prototype.axios = axios的方式添加了原型链方法)的方式使用axios请求是因为其挂载到了vue的实例中,因而this的指向是Vue

而vuex中this的指向是store,因此不能直接使用

解决方法

直接引入axios而后通过其请求即可

// 数据仓库中:src/store/modules/xxx.js
// 引入axios
import axios from 'axios'

// ...
actions: {
fetchOrderList ({commit, state}) {
// 而vuex中this的指向是store,因此不能使用
// 直接引入axios请求即可
axios.post('请求地址').then((res) => {
commit('updataOrderList', res.data.getOrderList.list)
}).catch((err) => {
console.log(err)
})
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐