axios封装

一般我们会在项目根目录的src文件夹下新建一个utils文件夹,
在文件夹下放http.js文件,在http.js中首先导入axios，
然后设置属性，比如baseURL（公共地址）和 timeOut (超时时间）
还可以设置响应拦截和请求拦截，在请求拦截中可以设置loading动画的开启和配置请求头的token
在响应拦截中可以关闭loading和根据后端返回的状态码检测token是否有效
最后把server导出

import axios from 'axios'

let server = axios.create({
	// 请求公共地址
    baseURL: "https://cnodejs.org/api",
    // 超时时间
    timeout: 5000,
})

// 请求拦截
server.interceptors.request.use(config => {
	// console.log(config); // config是一个包含了所有请求信息的对象 在这里可以修改config对象 修改之后需要返回config对象 请求才会正常进行
    config.headers.token = "asidoaslkd-12301jkwqmwlq-sadjalsmdl2"
    return config
}, err => {
    // throw new Error(err)
    Promise.reject(err)
})


// 响应拦截
server.interceptors.response.use(res => {
    // res 是服务器返回的数据信息
    // console.log(res);
    return res.data
}, err => {
    throw new Error(err)
})

export default server

在utils新建一个api.js文件

export const getTopics = () => server({ url: '/v1/topics' })

在页面中就可以直接导入使用

import {getTopics} from '@/utils/api'
getTopics().then(res =>{})