vue项目中配置简单的代理与promise，并简单封装请求接口

正向代理：

首先在vue项目根目录下，找到vue.config.js(vite框架下是vite.config.js)文件，找到server：{}，

如果项目地址为http://medical.kuxia.top/api/Admin/del_area

内部添加以下代码：

proxy: {
      '/api': {
        target: 'http://medical.kuxia.top/api',//项目路径
        changeOrigin: true, //支持跨域
        rewrite: (path) => path.replace(/^\/api/, ''), //重写路径
      },

其中地址名各自为

http://medical.kuxia.top/api/Admin/del_area
协议-域名/模块名/控制器/操作函数

代理目录：/api  
代理地址：http://medical.kuxia.top/api
替换路径：/api

反向代理：

一般在项目运行服务器内配置：

配置项与配置正向代理相同

promise：

异步编程，解决向外部传参

普通函数可以通过return返回值，但return只会返回给上层，如果多层时拿不到值；

promise不论多少层，都可以将值传递给then，只需要在then函数内写接下来的操作

let del = new Promise((resolve) => {
    axios({
        url: '/api/Admin/del_area',
        method: 'GET',
        params: {

        }
    }).then(res => {
        resolve(res)
    })
    
})
del.then(res => {
    console.log(res);
})

接口封装：

1. 新建一个api文件夹

2. 按功能、模块等新建对应的js文件

3. 在内部写对应的封装接口，并导出

import axios from 'axios'
/**
 * 接口名称：
 * 接收参数：
 * 返回参数：
 * 
 */
export const del = (data) => {
    return new Promise((resolve) => {
        axios({
            url: '/api/Admin/del_area',
            method: 'GET',
            params: data
        }).then(res => {
            resolve(res)
        })
    })
}

        4.在需要使用的页面导入调用即可

import { del } from '../api/admin'

del({ id: 0 }).then(res => {
    console.log(res);
})