| 1.下载axios插件 2.在main.js引入axios import axios from 'axios'Vue.prototype.$http = axios 3.创建axios实例 let service = axios.create({ baseURL: baseUrl, // url = base api url + request url withCredentials: true, // send cookies when cross-domain requests timeout: 5000 // request timeout})4.请求拦截 let loading;// 请求拦截service.interceptors.request.use(config => { // loding动画开启 loading = Toast.loading({ duration:10000, message:"加载中...", forbidClick:true, }) //config.headers['Authorization'] = sessionStorage.getItem('token') return config},error =>{ console.log(error); return Promise.reject(error)})5.响应拦截 // 响应拦截service.interceptors.response.use(res =>{ // 清除loading loading.clear() return Promise.resolve(res)},error =>{ loading.clear() console.log('err'+error); return Promise.reject(error)})6.抛出 // 抛出export default service 完整代码 // 引入文件import axios from 'axios'import {baseUrl} from '@/config'import {Toast} from 'vant' // 基础配置let service = axios.create({ baseURL: baseUrl, // url = base api url + request url withCredentials: true, // send cookies when cross-domain requests timeout: 5000 // request timeout}) let loading;// 请求拦截service.interceptors.request.use(config => { // loding动画开启 loading = Toast.loading({ duration:10000, message:"加载中...", forbidClick:true, }) //config.headers['Authorization'] = sessionStorage.getItem('token') return config},error =>{ console.log(error); return Promise.reject(error)}) // 响应拦截service.interceptors.response.use(res =>{ // 清除loading loading.clear() return Promise.resolve(res)},error =>{ loading.clear() console.log('err'+error); return Promise.reject(error)}) // 抛出export default service到此这篇关于JavaScript axios安装与封装案例详解的文章就介绍到这了,更多相关js axios安装与封装内容请搜索wanshiok.com以前的文章或继续浏览下面的相关文章希望大家以后多多支持wanshiok.com！
Vue项目中使用addRoutes出现问题的解决方法
JavaScript函数之call、apply以及bind方法案例详解 |
