6月11

今天组长去做核算检测，我们在组长的安排下，自觉的组织背面试题，前两节自习课也是对昨天讲的增加功能进行一个消化，光听不敲代码肯定是不行的，我也是照着老大的代码敲了敲，后两节课主要是我们组的王茱琳进行了一个造轮子分享，他分享的是弹框组件，比如我们点击某个功能出现一个弹框，或者我们需要支付的时候出现一个支付的弹框，这些弹框基本上都有确认和取消按钮，那么封装起来用来复用也是很方便的，那么王茱琳也是将他封装的一个思路，还有过程进行了一个分享，讲的还是很棒棒的。 下午主要是对后台管理系统的接口进行了一个封装，因为我也是省事按照老师的代码敲的，没有对接口进行封装，那么算上这次差不多第三次讲解了

具体思路

//引入axios
import axios from 'axios'

const service = axios.create({
    baseURL:`www.baidu.com`, //默认访问基地址
    timeout:3000, //请求延迟时间
});

//请求拦截
service.interceptors.request.use(function (config) {
    // 请求前处理，例如：处理请求头header
    return config;
  }, function (error) {
    // 报错返回
    return Promise.reject(error);
  });
//响应拦截
service.interceptors.response.use(function (response) {
    //成功返回 对状态码进行统一处理  例如：200，400，500 单独判断处理各种情况
    
    if (response.data.data && response.data.meta) {
        var { data: res, meta: { msg, status } } = response.data;
        if (status === 200) {
            console.log('msg::',msg)
        } else {
          console.log('msg::',msg)
           Promise.reject(msg)
        }
    } else {
        
        Message({
            message:'参数有误，请检查',
            type: "error"
        });
     }
  }, function (error) {
    //返回报错处理
    Message({
        message:'接口请求有误，请检查',
        type: "error"
    });
        
});
  
export default service;

然后在另外一个js文件中我们封装各种请求并抛出

// 请求登录方法
export function login(data) {
    return request({
        url: 'login',
        method: 'post',
        data
    })
}

// 请求用户列表
export function getUser(params) {
    return request({
        url: 'users',
        method: 'get',
        params
    })
}