一、先来说说为什么要封装axios异步请求。

我们前端开发中总是会遇到跨域的问题，我们会配置proxy来解决跨域的问题，无论是vue 还是react。

如何配置我这里就不说了。

然后...然后我们就会遇到一个打包上线的问题，上线时候我们必须把前缀拼接上，如果每个页面都保存一个路径变量会很麻烦，所以我们会封装axios来统一管理路径，这样可以使我们页面请求变得更加简洁。

[JavaScript] 纯文本查看 复制代码

import axios from 'axios'
import qs from 'qs'

let http={
    post:"",
    get:""
}
// [url]http://60.10.00.005:8080[/url]
//方法一 统一拦截

const Website="";
http.post= function (api,data){
    let params = qs.stringify(data)
    return new Promise((resolve,reject) => {
        axios.post(`${Website}`+api,params).then((res) =>{
            resolve(res)
        })
    })
}
http.get= function (api,data){
    let params = qs.stringify(data)
    return new Promise((resolve,reject) => {
        axios.post(`${Website}`+api,params).then((res) =>{
            resolve(res)
        })
    })
}
方法二单个请求定义
// export function _login(data){
//     let params = qs.stringify(data)
//     return axios.post('/hrjc/mobile/login',params)
// }
export default http

用法如下：

[JavaScript] 纯文本查看 复制代码

import http from '../server';
 http.post("/login",{"loginName": userName,"password": password})
          .then(function(response){}
          .catch(function(err){
              console.log("失败"+err);
            })

一、先来说说为什么要封装axios异步请求。

我们前端开发中总是会遇到跨域的问题，我们会配置proxy来解决跨域的问题，无论是vue 还是react。

如何配置我这里就不说了。

然后...然后我们就会遇到一个打包上线的问题，上线时候我们必须把前缀拼接上，如果每个页面都保存一个路径变量会很麻烦，所以我们会封装axios来统一管理路径，这样可以使我们页面请求变得更加简洁。

[JavaScript] 纯文本查看 复制代码

import axios from 'axios'
import qs from 'qs'

let http={
    post:"",
    get:""
}
// [url]http://60.10.00.005:8080[/url]
//方法一 统一拦截

const Website="";
http.post= function (api,data){
    let params = qs.stringify(data)
    return new Promise((resolve,reject) => {
        axios.post(`${Website}`+api,params).then((res) =>{
            resolve(res)
        })
    })
}
http.get= function (api,data){
    let params = qs.stringify(data)
    return new Promise((resolve,reject) => {
        axios.post(`${Website}`+api,params).then((res) =>{
            resolve(res)
        })
    })
}
方法二单个请求定义
// export function _login(data){
//     let params = qs.stringify(data)
//     return axios.post('/hrjc/mobile/login',params)
// }
export default http

用法如下：

[JavaScript] 纯文本查看 复制代码

import http from '../server';
 http.post("/login",{"loginName": userName,"password": password})
          .then(function(response){}
          .catch(function(err){
              console.log("失败"+err);
            })