axios的请求封装

# 1.在utils里面新建个js文件比如http.js及安装axios插件包

import axios from 'axios'
// 请求与响应的拦截
const request = axios.create({
  baseURL:
    process.env.NODE_ENV === 'development'
      ? ''
      :'http://localhost:3001',//所需的环境地址
  timeout: 5000
})
// 请求头
request.interceptors.request.use(
  function (config) {
    return config
  },
  function (error) {
    return Promise.reject(error)
  }
)
// 响应头
request.interceptors.response.use(
  function (res) {
    return res
    //这里可以做接口鉴权
  },
  function (error) {
    return Promise.reject(error)
  }
)

export default request

2.新建api文件--api.js新增api

第一种

import http from '_utils/http.js'

const baseUrl = '/v1'
// 首页banner
const HotelBanner = (params = {}) => http.get(baseUrl +'/hotel/banner', { params })

第二种

import request from '_utils/http.js'
export const accommodationApi = () => { 
    return request({
        url: '/v1/shop/list'
    })
}

3.api的调用 首先导入该页面所需的接口

第一种

LifePictureLists() {
      LifePictureList().then((res) => {
        if (res.data.code === 200) {
        this.live = res.data.data;
        }
      });
    },

第二种

async JournalismApi() {
      try {
        let { data } = await JournalismApi();
        this.Journalism = data.data;
      } catch (error) {
        console.log(error);
      }
    },