vue axios

个人理解，axios类似于ajax请求，下面详细介绍axios的使用
1、首先在安装axios
npm install axios –save
2、安装其他插件的时候，可以直接在 main.js 中引入并使用 Vue.use()来注 册，但是 axios并不是vue插件，所以不能 使用Vue.use()，所以只能在每个需 要发送请求的组件中即时引入。
为了解决这个问题，我们在引入 axios 之后，通过修改原型链，来更方便的使用。

/**
 * Created by Administrator on 2017/8/31.
 */
//引入axios
import axios from 'axios'
//引入qs这个是在axios安装的时候就默认安装了
import qs from 'qs'
//axios的默认配置
axios.defaults.timeout=5000;//设置连接超时的时间
axios.defaults.baseURL='http://127.0.0.1:8080/'//
// //配置请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';
//POST传参序列化(添加请求拦截器)
axios.interceptors.request.use((config)=>{
  //发送请求之前做的做的事
    if(config.method=='post'){
      config.data=qs.stringify(config.data);
    }
    return config;
},(error)=>{
  alert("错误的传参")
  return Promise.reject(error);

})

//返回状态判断
axios.interceptors.response.use((res)=>{
  //对响应数据最些事
  if(!res.data.success){
    return Promise.reject(res);
  }
},(error)=>{
    alert("网络异常")
    return Promise.reject(error);
})

//返回一个promise(发送post请求)
//Promise是ES6中的重要特性
//Promise是一个构造函数
//Promise的构造函数接收一个参数，是函数，并且传入两个参数：resolve，reject，
// 分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。//主要特点就是链式操作
export function fetch(url,params){
  return new Promise((resolve,reject)=>{
    axios.post(url,params).then((response)=>{
      resolve(response.data);
    },err=>{
      reject(err);
    }).catch((error)=>{
      reject(err);
    })
  })

}


export default {
  //所有请求后台的地址  例如
 /* Login(params) {
    return fetch('/users/api/userLogin', params)
  },*/
  //在vue组件中直接映入 fetch这个文件在
  //import api from '../fetch/api'
  //使用 api.方法名(params)，api.Login(“123”)

}