封装axios在util中

创建util工具类,封装通用的get和post请求

封装axios成工具类,方便大家请求调用

1、创建util文件夹
2、创建request.js
3、封装
//封装请求相关方法
//初始化一个axios对象

// 需要引入axios
import axios from ‘axios‘

// 创建实例时设置配置的默认值
var instance = axios.create({
  // 接口地址根路径 url = base url + request url
  baseURL: ‘https://api.example.com‘ 
  // 超时时间
  timeout:30000 //30s
});
//添加请求和响应拦截器
// 添加请求拦截器
instance.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  });

// 添加响应拦截器
instance.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    return response;
  }, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
  });

// 创建一个get请求方法,直接返回数据
let get = async function(url,params){
	let {data} = await instance.get(url,{params});
	return data
};
//创建一个post方法
let post = async function(url,params){
	let {data} = await instance.post(url,params);
	return data
};

// 导出get和post方法
export{
 	get,
	post
}

方法写好了如何使用?--将get post交给vue

1、自定义插件 myPlugin.js
封装axios在util中
封装axios在util中
2、注册myPlugin插件
封装axios在util中
3、自此,可以在自己的组件中直接使用
比如login.vue中
直接this.$get(‘/admin/Login‘,this.ruleForm);
封装axios在util中

封装axios在util中

上一篇:手机拍照扫描件处理方法


下一篇:Java之多线程的电脑生产