目录
创建一个httpjs
根目录下创建一个httpjs,代码如下
import axios from "axios";
import qs from "qs";
// react 中使用antd 此处自定义
// import { message } from "antd";
// vue中使用element-ui 此处自定义
// import { Loading} from "element-ui";
// 创建axios默认请求
axios.defaults.baseURL = "http://xxxxxx.com";
// 配置超时时间
axios.defaults.timeout = 100000;
// 配置请求拦截
axios.interceptors.request.use(config => {
// config.setHeaders([
// // 在这里设置请求头与携带token信息
// ]);
return config;
});
// 添加响应拦截器
axios.interceptors.response.use(
function(response) {
console.log(response);
return response;
},
function(error) {
// 对响应错误做点什么
return Promise.reject(error);
}
);
/**
* get请求
* @method get
* @param {url, params, loading} 请求地址,请求参数,是否需要加载层
*/
var get = function(url, params, loading) {
return new Promise((resolve, reject) => {
// {
// params: params
// }
axios
.get(url, params)
.then(res => {
resolve(res);
})
.catch(err => {
reject(err);
});
});
};
/**
* post请求
* @method post
* @param {url, params} 请求地址,请求参数,是否需要加载层
*/
var post = function(url, data) {
return new Promise((resolve, reject) => {
// qs.stringify(data)
axios
.post(url, data)
.then(res => {
console.log(res);
resolve(res);
})
.catch(err => {
reject(err);
});
});
};
export default { get, post };
vue-cli引入:
在mainjs中直接引入:
import axios from './http'
Vue.prototype.$http = axios;
对应的页面直接使用 this.$http.get/post 发送请求
React 引入:
React 中,启动框架的方式是通过执行 ReactDOM.render()
这样一种方式来进行的,没有一个全局的对象,因而无法通过类似React.prototype.xxx = xxx
的方式来进行设置。
因此可以在对应的页面引入httpjs,然后通过例如:import axios from "../../axios/http";然后通过axios.get/post 发送请求