vue aixos網絡請求的開發封裝

vue-router 以後不再維護了  當前比較多使用的是ajax和axios

ajax 是Asynchronous Javascript And XML 異步js 和xml，是一種異步請求的技術

aixos在npm上的描述是Promise based HTTP client for the browser and node.js，是一種基於promise封裝的http客戶端

在network 的文件夾下 封裝一個request.js  想要調用接口的時候直接引用request.js 

如果接口發生改變 那麼只需要在request.js一個地方改就ok啦

要使用axios  首先要進行安裝npm install axios

import Axios from 'axios'

Axios({
   //拿數據的URL
}).then((res) => {
 //拿到返回的數據  
}).catch((err) => {
  //沒有返回數據時做出處理
});

axios 併發請求

Axios.all([Axios({
  url: '',
}), Axios({
  url: '',
  params: {

  }
})
]).then(res => { 

})

 axios全局配置

Axios.defaults.baseURL = '';
Axios.defaults.timeout = 3000;
Axios.all([Axios({
  url:'home/goods'
}), Axios({
  url:'home/data',
  params: {
    type: 'sell',
    page:5
  }
})]).then(res => { 
  
})

終極封裝網絡請求方法

import Axios from 'axios'

export function request(config){
  const instance = Axios.create({
    baseURL: '',
    timeout:3000,
  })
  //攔截器
  instance.interceptors.request.use(config => {
    console.log(config);
    return config;
  }, err => {
      console.log(err);
  })
  instance.interceptors.response.use(res => { 
    return res.data;
  }, err => { 
      console.log(err);
  })
}