博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
封装axios
阅读量:4332 次
发布时间:2019-06-06

本文共 1805 字,大约阅读时间需要 6 分钟。

import axios from 'axios'// import store from '@/vuex/store.js'import router from '../router'import qs from 'qs'const instance = axios.create({});instance.defaults.baseURL = 'http://mini.youhulianchuang.com';instance.defaults.timeout = 5000;instance.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';instance.defaults.headers.post['X-Requested-With'] = 'XMLHttpRequest';instance.defaults.headers.post['top-token'] = 'top-token';instance.defaults.responseType = 'json';// 请求拦截instance.interceptors.request.use(function (config) {    // 在发送请求之前做些什么  console.log('请求拦截')  console.log(config)    return config;  }, function (error) {    // 对请求错误做些什么    // alert('网络错误,请稍后再试');  });// 对传给后台的数据做统一的操作instance.defaults.transformRequest=[function (data) {  // 对 data 进行任意转换处理  Object.assign(data,{age:21})  console.log(data)  return data;}]// `transformResponse` 在传递给 then/catch 前,允许修改响应数据instance.defaults.transformResponse=[function (data) {  // 对 data 进行任意转换处理  console.log(data)  return data;}]	// 添加响应拦截器instance.interceptors.response.use(function (response) {  console.log('添加响应拦截器')    console.log(response)  	return response.data;	}, function (error) {  	// 对响应错误做点什么	if(error.response) {	}  	// return Promise.reject(error);});export default {
install: function(vm){
    vm.prototype.$instance = instance; }

 2、调用

在main.js中引入封装文件并当作vue插件使用

import Utile from './lib/utils'

Vue.use(Utile)

3、在模块中使用get请求

this.$instance.get(`Employee/Detail/${this.$route.query.userId}`

                ).then((res)=>{    
                    console.log(res.data)
                    if(res.data.code == 0){
                       操作
                 }
                 else{

}

})

4、在模块中使用post请求

 this.$instance.post("/enumList",

                  params).then(({ data: { data = []} = {} })=>{
                  console.log(data)
                })
                .catch((error) =>{
                  console.log(error);
                });
      })

注:params是参数

 

转载于:https://www.cnblogs.com/zhouxiaobai/p/9340211.html

你可能感兴趣的文章
数据库语法-1
查看>>
usaco 2017 US Open
查看>>
css3记事
查看>>
Extjs_工具栏和菜单栏
查看>>
Spring集成Quartz定时任务框架介绍和Cron表达式详解
查看>>
甲乙用同一串数字玩游戏
查看>>
【NOIP2016】组合数问题
查看>>
【刷题】【LeetCode】000-十大经典排序算法
查看>>
Burp Suite Professional 针对APP抓包篡改数据提交【安全】
查看>>
bootstrap使用之多个弹窗和拖动效果[开发篇]
查看>>
DEV组件LookupEdit,ComboBoxEdit绑定数据源
查看>>
VMware Workstation CentOS7 Linux 学习之路(4)--守护服务(Supervisor)
查看>>
Vue.js学习笔记(三) - 修饰符
查看>>
移动端事件(touchstart、touchmove、touchend)--移动端开发整理笔记(三)
查看>>
团队冲刺第十天
查看>>
关于jquery判断对象是否为空
查看>>
L2-028 秀恩爱分得快(模拟)
查看>>
Vue + Webpack 根据不同环境打包
查看>>
QT-creater一个非常棒的教程
查看>>
译:用InnoSetup模块化安装依赖项
查看>>