vue3中几种封装让后端传参请求方式

1、post请求,但是后端参数不是对象,是一个单参

后端

        /// <summary>
        /// 获取项目服务详情
        /// </summary>
        /// <param name="id"></param>
        /// <returns></returns>
        /// <exception cref="UserFriendlyException"></exception>
        [AllowAnonymous]
        [HttpPost("get-eploymentDetails")]
        public async Task<GetProjectDetailsDto> GetDetailsAsync(Guid id)
        {
            return await _projectServiceAppService.GetDetailsAsync(id);
        }

前端使用如下,是错误的,传参传不过去

// 获取就业服务详情

export function getDetail(id) {

  return request({

    url: "/api/SupplyDemand/employmentService/get-eploymentDetails",

    method: "post",

    data: { id },

  });

}

 需使用如下形式:

//获取项目服务详情

export function getDetail(id) {

    return request({

      url: "/api/SupplyDemand/projectService/get-eploymentDetails",

      method: "post",

      params: { id },

    });

}

2、get请求

后端

        /// <summary>
        /// 项目专题列表
        /// </summary>
        /// <param name="count">显示条数</param>
        /// <returns></returns>
        [HttpGet("get-projectList")]
        [AllowAnonymous]
        public async Task<List<GetProjectListDto>> GetProjectListAsync(int count)
        {
            return await _projectServiceAppService.GetProjectListAsync(count);
        }

前端

//项目服务列表

export function getProjectList(count){

    return request.get(

        `/api/SupplyDemand/projectService/get-projectList?count=${count}`

    );

}

3、post请求,后端定义的一个对象参数

        /// <summary>
        /// 创建或更新项目服务
        /// </summary>
        /// <param name="input"></param>
        /// <returns></returns>
        /// <exception cref="BusinessException"></exception>
        [HttpPost("create-update-project")]
        public async Task CreateOrUpdateAsync(CreateOrUpdateProjectInput input)
        {
            await _projectServiceAppService.CreateOrUpdateAsync(input);
        }

前端

//申请项目服务咨询

export function subimtServiceApply(data){

    return request({

        url: "/api/SupplyDemand/serviceApply/carete-serviceApply",

        method: "post",

        data,

    });

}

相关推荐

  1. vue3封装请求方式

    2024-01-24 15:30:02       31 阅读
  2. vue 前端接收的方式

    2024-01-24 15:30:02       14 阅读
  3. uniapp 跨页面方式

    2024-01-24 15:30:02       33 阅读
  4. vue3页面汇总

    2024-01-24 15:30:02       40 阅读
  5. 各种格式混合vue前端

    2024-01-24 15:30:02       22 阅读
  6. 前端get请求日期类型参数向失败

    2024-01-24 15:30:02       13 阅读
  7. vue3组件

    2024-01-24 15:30:02       17 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-01-24 15:30:02       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-01-24 15:30:02       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-01-24 15:30:02       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-01-24 15:30:02       18 阅读

热门阅读

  1. 边缘计算:在挑战与机遇的浪潮中破浪前行

    2024-01-24 15:30:02       29 阅读
  2. 边缘计算的挑战和机遇

    2024-01-24 15:30:02       37 阅读
  3. Dart/Flutter工具模块:the_utils

    2024-01-24 15:30:02       40 阅读
  4. 《设计模式的艺术》笔记 - 备忘录模式

    2024-01-24 15:30:02       32 阅读
  5. Oracle中TO_DATE与TO_CHAR区别

    2024-01-24 15:30:02       38 阅读
  6. Oracle 数据库恢复删除的数据

    2024-01-24 15:30:02       41 阅读
  7. 软件工程测试3

    2024-01-24 15:30:02       34 阅读