vue 前端参值后端接收的几种方式

简介: vue 前端参值后端接收的几种方式


Get 请求 @Param

前端代码

handleCS(){
      // debugger
      // let body ={
      //   id:8,
      //   nyApplyDangerdetectionId:8,  
      //   uploadStatic:2,
      //   auditorSign:'改我了',
      //   auditorDescribe:'我也改了'
      // }
      let companyid = 1
      let body = {} 
      getSelectDanger(companyid).then(response => {
        body = response;
        // this.open = true;
        // this.title = "修改隐患排查";
      });
    },

调用接口

// 接口测试调用
export function getSelectDanger(companyid) {
  return request({
    url: '/system/uniapp/getboolWriteBack',
    method: 'get',
    params: {companyid : companyid}
  })
}

后端代码controller接收

@ApiOperation("getboolWriteBack")
@GetMapping("/getboolWriteBack")
public AjaxResult getboolWriteBack(Integer companyid){
    Integer count = nyPostNumberService.routineWriteBack(companyid);
    boolean falg = false;
    if(count==null){
        falg = true;
    }
    return AjaxResult.success(falg);
}

后端代码Mapper层

public Integer routineWriteBack(@Param("companyid")  Integer companyid);

后端代码Mapper.xml

<select id="routineWriteBack" resultType="java.lang.Integer">
       select onduty_people from ny_post_number where companyid = #{companyid} and date(create_time) = date(now())
    </select>

Put请求 @RequestBody

前端代码

handleCS(){
     let body ={
       id:12,
       nyApplyDangerdetectionId:7898994,  
       uploadStatic:2,
       auditorSign:'改我了',
       auditorDescribe:'我也改了'
     }
     getSelectDanger(body).then(response => {
     });
   },

调用接口

export function getSelectDanger(data) {
  return request({
    url: '/warningrisk/dangerdetection/UpdateuploadStatic',
    method: 'put',
    data: data
  })
}

后端代码controller接收

@Log(title = "隐患排查", businessType = BusinessType.UPDATE)
@PutMapping("/UpdateuploadStatic")
public AjaxResult UpdateuploadStatic(@RequestBody NyDangerdetection nyDangerdetection)
{
    return toAjax(nyDangerdetectionService.updateuploadStatic(nyDangerdetection));
}

后端代码Mapper层

Integer updateuploadStatic(NyDangerdetection nydangerdetection);

后端代码Mapper.xml

<update id="updateuploadStatic" parameterType="NyDangerdetection">
     UPDATE ny_dangerdetection a
         INNER JOIN ny_apply_dangerdetection b ON a.ny_apply_dangerdetection_id = b.id
     <trim prefix="SET" suffixOverrides=",">
         <if test="uploadStatic != 0">a.upload_static = #{uploadStatic},</if>
         <if test="uploadStatic == 2">b.auditor_sign = #{auditorSign},</if>
         <if test="uploadStatic == 3">b.auditor_describe = #{auditorDescribe} </if>
     </trim>
     where a.ny_apply_dangerdetection_id = #{nyApplyDangerdetectionId} and b.id = #{id}
</update>
目录
相关文章
|
1天前
|
前端开发 JavaScript Java
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
|
1天前
|
前端开发 Java Go
从前端到后端:构建现代化Web应用的技术实践
本文将介绍如何通过前端和后端技术相结合,构建现代化Web应用的技术实践。我们将探讨前端开发、后端架构以及多种编程语言(如Java、Python、C、PHP、Go)在构建高效、可扩展的Web应用中的应用。
|
1天前
|
前端开发 JavaScript Java
npm与Maven:前端与后端构建工具深度对比学习
npm与Maven:前端与后端构建工具深度对比学习
|
2天前
|
前端开发 JavaScript API
阿珊比较Vue和React:两大前端框架的较量
阿珊比较Vue和React:两大前端框架的较量
|
2天前
|
前端开发 JavaScript NoSQL
从前端到后端:构建全栈开发者的必备技能
随着互联网技术的不断发展,全栈开发者的需求日益增长。本文将介绍如何从前端到后端,掌握全栈开发所需的关键技能,包括前端框架的选择、后端语言的学习以及数据库的应用,帮助读者构建成为全面的技术专家。
|
3天前
|
前端开发 测试技术 持续交付
《跨界合作:前端与后端如何优化协作效率》
在当今软件开发领域,前端和后端开发团队通常是分开工作的,但他们的协作质量直接影响着项目的成功与否。本文将探讨如何通过优化前端与后端的协作方式,提高开发效率和项目质量,从而实现更好的跨界合作。
|
3天前
|
JSON JavaScript 前端开发
vue的 blob文件下载文件时,后端自定义异常,并返回json错误提示信息,前端捕获信息并展示给用户
vue的 blob文件下载文件时,后端自定义异常,并返回json错误提示信息,前端捕获信息并展示给用户
|
3天前
|
监控 Java 开发者
构建高效微服务架构:后端开发的新趋势
【5月更文挑战第13天】随着现代应用的复杂性日益增加,传统的单体应用架构已不足以满足快速迭代和可扩展性的需求。本文将探讨如何通过微服务架构来提升后端开发的效率和系统的可靠性,涵盖微服务设计原则、技术栈选择、部署策略以及维护实践。我们将分析微服务的优势与挑战,并提供一系列实施建议,帮助开发者在构建和维护分布式系统时做出明智决策。
|
3天前
|
存储 监控 API
构建高效微服务架构:后端开发的新趋势
【5月更文挑战第13天】在现代软件开发中,随着业务需求的多样化和开发流程的复杂化,传统的单体应用架构逐渐显得笨重且难以适应快速变化。微服务架构作为一种新兴的分布式系统设计方式,以其灵活性、可扩展性和技术多样性受到广泛关注。本文旨在探讨微服务架构的核心概念、设计原则以及实施策略,为后端开发人员提供一种提升系统性能和开发效率的有效途径。
42 2
|
22小时前
|
Kubernetes API 数据库
构建高效微服务架构:后端开发的新趋势
【5月更文挑战第17天】 随着云计算的普及和容器化技术的成熟,微服务架构已成为企业软件开发的首选模式。该架构通过将大型应用程序拆分为一系列小型、自治的服务来提供灵活性和可扩展性。本文将探讨微服务架构的关键概念,包括服务的细粒度划分、独立部署、以及如何通过容器编排实现高可用性。同时,我们将讨论微服务实施的最佳实践和面临的挑战,为后端开发者提供构建和维护微服务系统的实用指南。