Vue项目中统一管理api请求

1.在src文件新建api文件夹，然后在api文件夹下新建各个模块的文件，如use.js文件

// 引入封装的axios
import request from "@/utils/request";


// 第一种方法
// post方法
export function login(data) {
  return request({
    method: 'post',
    url: '/user/login',
    data
  })
}

//get方法
export function getUser(params) {
  return request({
    method: 'get',
    url: '/user/list',
    params
  })
}

// 第二种方法
export const login = (data) => {
  return request.post('/user/login', data)
}

2.使用

// 引入
    import {login} from "@/api/user"

//使用
    login() {
      this.$refs.loginForm.validate(async (valid) => {
        if (!valid) return

        // 在这里直接使用分装好的login，然后传入数据就好了
        let result = await login(this.$qs.stringify(this.loginForm))
        if (result.status === 200) {
          window.sessionStorage.setItem('token', result.data.token)
          this.$message.success(result.msg)
          this.$router.push('/home')
        } else {
          this.$message.error(result.msg)
        }
      });
    }