vue如何利用axios调用后台api接口

npm install axios

// 引入axios
import axios from 'axios'
// 请求延时（毫秒数，如果请求话费超过了'timeout'的时间，请求将被中断）
axios.defaults.timeout = 100000

export const getAllData = params => {
  return axios.get(`http://localhost:8081/api/projectInfo/GetAll`,{ params: params });
};

import { getAllData } from '../api/api'

 getAllData().then((res) => {
      console.log(res)
    })

export const getAllData = params => {
  return axios.get(`api/projectInfo/GetAll`,{ params: params });
};

axios.defaults.baseURL="/api"

 proxyTable: {
      // 配置多个代理
      "/api": {
        target: "http://localhost:8081",
        secure:true,
        changeOrigin: true,
        pathRewrite: {
          // 路径重写，
          "^/api": "" // 替换target中的请求地址
        }
      },
    },

target: "http://localhost:8081",

target: "http://112.125.90.247:81",

target: "http://112.125.90.247:82",

"/api": {
        target: "http://localhost:8081",

location ~/api {
			#rewrite ^/api/(.*)$ /$1 break;
			proxy_pass http://127.0.0.1:8081; #接口地址
		}

/**
 * 数据管理页面新增一条数据
 * @param {*} params
 * qs.stringify()将对象 序列化成URL的形式，以&进行拼接，来传递参数
 * @returns
 */
export const addData = params => {
    return axios.post(`${base}/api/Data/post`, qs.stringify(params), {
        headers: {
            "Content-Type": "application/x-www-form-urlencoded;charset=utf-8"
        }
    }); // 这里是跨域的写法
};

/**
 * 数据管理页面编辑一条数据
 * @param {*} params
 * @returns
 */
export const editData = params => {
    return axios.post(`${base}/api/Data/put`, qs.stringify(params), {
        headers: {
            "Content-Type": "application/x-www-form-urlencoded;charset=utf-8"
        }
    }); // 这里是跨域的写法
};

/**
 * 数据管理页面根据id删除一条数据
 * @param {*} id
 * @returns
 */
export const DeleteDataById = id => {
    return axios.get(`${base}/api/Data/DeleteById/${id}`);
};

/// <summary>
		/// 新增数据
		/// </summary>
		///<param name="request">一条数据</param>
		[HttpPost]
		public MessageModel<string> Post([FromBody] Data request)
		{
			var data = new MessageModel<string>();
			request.Id = Guid.NewGuid().ToString();
			request.CreateTime = DateTime.Now;
			//插入数据
			var id = DbContext.Insertable(request).ExecuteCommand();
			//查询是否添加成功
			var success1 = DbContext.Queryable<Data>().Where(it => it.Id == request.Id)
				.ToList();
			data.success = success1.Count > 0;
			if (data.success)
			{
				data.response = id.ToString();
				data.msg = "添加成功";
				log4net.ILog log = log4net.LogManager.GetLogger("MyLogger");
				log.Info("Data" + "-" + "Add" + "-" + request.Id);
			}
			return data;
		}

		/// <summary>
		/// 编辑数据
		/// </summary>
		///<param name="request">一条数据</param>
		[HttpPost]
		public MessageModel<string> Put([FromBody] Data request)
		{
			var data = new MessageModel<string>();
			request.UpdateTime = DateTime.Now;
			if (request.Id != null)
			{
				var id = DbContext.Updateable(request).ExecuteCommand();
				data.success = (id > 0);
				if (data.success)
				{
					data.msg = "更新成功";
					data.response = id.ToString();
					log4net.ILog log = log4net.LogManager.GetLogger("MyLogger");
					log.Info("Data" + "-" + "Edit" + "-" + request.Id);
				}
			}
			return data;
		}

		/// <summary>
		/// 根据主键Id删除一条数据
		/// </summary>
		///<param name="Id">编号</param>
		[HttpGet]
		public MessageModel<string> DeleteById(string Id = "")
		{
			var data = new MessageModel<string>();
			var id = DbContext.Deleteable<Data>().In(Id).ExecuteCommand();
			data.success = (id > 0);
			if (data.success)
			{
				data.msg = "删除成功";
				data.response = id.ToString();
				log4net.ILog log = log4net.LogManager.GetLogger("MyLogger");
				log.Info("Data" + "-" + "Delete" + "-" + Id);
			}
			return data;
		}