首页 > IT职业 > IT图书 > vue中使用axios的封装
在aixos文件夹下的index.js文件中写aixos的构造函数,然后可以自己配置参数
import axios from 'axios'
import qs from 'qs'
const instance = axios.create({
baseURL: 'http://xxx.me',
timeout: 1000,
headers: { 'Content-Type': 'application/x-www-form-urlencoded;' }
});
instance.interceptors.request.use((config) => {
if (config.method === 'post') {
//如果是post请求则进行序列化处理
config.data = qs.stringify(config.data);
}
return config;
}, (error) => {
return Promise.reject(error);
});
instance.interceptors.response.use((res) => {
if (res.status!==200) {
return Promise.reject(res);
}
return res;
}, (error) => {
//404等问题可以在这里处理
return Promise.reject(error);
});
export default instance
在main.js文件中
import Vue from 'vue’
import axios from './axios’
Vue.prototype.KaTeX parse error: Expected 'EOF', got '写' at position 16: axios = axios; 写̲在Vue的prototype原…axios调用。
在helloworld.vue文件中
如果是get请求,则
this.$axios({
method: "get",
url: "/api/zzz"
})
.then(res => {
//请求成功返回体的数据res
})
.catch(err => {
//请求失败返回体的数据err
});
如果是post请求,则
this.$axios({
method: "post",
url: "/api/zzz",
data:{
name:"jianguang"
}
})
.then(res => {
//请求成功返回体的数据res
})
.catch(err => {
//请求失败返回体的数据err
});
来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4822/viewspace-2815389/ ,如需转载,请注明出处,否则将追究法律责任。