vue axios使用手册

1.下载插件
npm install axios
npm install qs

2.在vue-cli main.js中添加

import axios from 'axios'
import Qs from 'qs'
Vue.prototype.axios = axios
Vue.prototype.Qs = Qs

3.axios配置(新建request.js)

import axios from 'axios'
import Qs from 'qs'
// 创建axios实例

const service = axios.create({
  //baseURL:'http://localhost:8080/static',
  baseURL: 'http://xztest.xiezixiansheng.com/mrwrite_aliyun/mobile.php',
  timeout: 50000, // 请求超时时间
  transformRequest: [
    /* 序列化参数 */
    function(data) {
      return typeof data !== "undefined" ? Qs.stringify(data) : data;
    }
  ]
})

service.interceptors.request.use(config => {
  // config.headers['access_token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
  return config
}, error => {
  // Do something with request error
  Promise.reject(error)
})

// respone拦截器
service.interceptors.response.use(
  response => {
    //console.log(response.data)
    if (response.data.resCode == 200 || response.data.result == 0) {
      return response.data
    }else {
      return Promise.reject('error')
    }
  },
  error => {
    console.log(error.message,"error")
    return Promise.reject(error)
  }
)

export default service

4.新建api.js

import request from '@/utils/request'

post请求:
export function GetMine(params){
  return request({
    url:'/Course/get_mycourse',
    method:'post',
    data: params
  })
}
get请求:
export function GetMine(params){
  return request({
    url:'/Course/get_mycourse',
    method:'get',
    params: params
  })
}

5.具体请求

import {
    GetMine, 
    } 
from '@/api/api.js'
created() {
    const params= {
      user_id: 2582
    }
    GetMine(params).then(res=>{
        this.showData(res.info);
      }).catch(res=>{
        console.log('catch:', res);
      });
    
  },

你可能感兴趣的:(vue axios使用手册)