axios封裝

• axios初級封裝

//get請求
export function get(url, params){    
    return new Promise((resolve, reject) =>{        
        axios.get(url, {            
            params: params        
        }).then(res => {
            resolve(res.data);
        }).catch(err =>{
            reject(err.data)        
    })    
})}

//post請求
export function post(url, params) {
    return new Promise((resolve, reject) => {
         axios.post(url, params)
        .then(res => {
            resolve(res.data);
        })
        .catch(err =>{
            reject(err.data)
        })
    });
}

• axios的優化封裝

初級封裝只是簡單封裝了get,post 請求。若涉及到token值或者是header則不夠用。

import axios from 'axios';
let headers = {
    'Content-Type': 'application/json;charset=UTF-8',
    Authorization: sessionStorage.getItem('token_type') + ' ' + sessionStore.getItem('access_token')
}

//GET請求
export function get( url, params) {
    return new Promise((resolve,reject)=>{
        axios({
            method: 'get',
            url: url,
            headers: headers,
            params: params,
            data: null
        }).then(res =>{
            resolve(res.data)
        }).catch(err =>{
            reject(err.data)
        })
    })
}

//POST請求
export function post( url, data){
    return new Promise((resolve,reject)=>{
        axios({
            method: 'post',
            url: url,
            data: data,
            headers: headers
        }).then(res =>{
            resolve(res.data)
        }).catch(err =>{
            reject(err.data)
        })
    })
}

//PUT請求。PUT請求的形式 - http://www.baidu.com:8080/api01/{id}
export function put( url, id, data ){
    return new Promise((resolve,reject)=>{
        axios({
            method: 'put',
            url: url + '/' + id,
            headers: headers,
            data: data
        }).then(res =>{
            resolve(res.data)
        }).catch(err =>{
            reject(err.data)
        })
    })
}

//delete請求。delete請求的形式 - http://www.baidu.com:8080/api02/{id}
export function delete(url ,id ){
    return new Promise((resolve,reject)=>{
        axios({
            method: 'delete',
            url: url + '/' + id,
            headers: headers
        }).then(res =>{
            resolve(res.data)
        }).catch(err =>{
            reject(err.data)
        })
    })
}