mpvue中配置axios使用
2020-03-24 本文已影响0人
zhudying
mpvue中使用axios
1.api的index.js文件下配置axios
import axios from 'axios';
/**
* axios配置
*/
// axios请求拦截器
axios.interceptors.request.use(config => {
//to do something...
return config;
}, error => {
mpvue.showToast({ icon: 'none', title: '网络繁忙,请稍后重试' });
console.log(error, 'error')
return Promise.reject(error);
})
// axios响应拦截器
axios.interceptors.response.use(data => {
//to do something...
mpvue.hideLoading();
return data;
}, error => {
mpvue.showToast({ icon: 'none', title: '网络繁忙,请稍后重试' });
console.log(error, 'error2')
return Promise.reject(error);
})
//axios自定义请求
axios.defaults.adapter = function (config) {
return new Promise((resolve, reject) => {
mpvue.request({
url: config.url,
data: config.params,
method: config.method,
header: {
'Authorization': 'xxx',
'Content-Type': 'application/json; charset=UTF-8'
},
success: (res) => {
return resolve(res);
},
fail: (res) => {
return reject(res);
}
})
})
}
/**
* url:请求地址
* params:请求参数
* mthods:请求方法
* */
export default async (url, params, method) => {
try {
const response = await axios(url, { params, method });
return response;
} catch (error) {
throw new Error(error);
}
}
2.api下新建page文件封装请求函数
import axios from './index'
export const getMessage = (params) => axios("http://xxx", params, 'post')
3.在页面引用请求函数
import { getMessage } from '@/api/page.js'
async handler () {
let res = await getMeaasge({})
console.log(res, 'res')
}