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>
目录
相关文章
|
18小时前
|
前端开发 Java Go
从前端到后端:构建现代化Web应用的技术演进
本文探讨了从前端到后端的技术演进,介绍了前端、后端以及多种编程语言,如Java、Python、C、PHP和Go,以及数据库在构建现代化Web应用中的应用。通过深入剖析各个技术领域的发展和应用,读者将对构建高效、可扩展、安全的Web应用有更深入的理解。
|
3天前
|
前端开发 JavaScript Java
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
Java网络商城项目 SpringBoot+SpringCloud+Vue 网络商城(SSM前后端分离项目)五(前端页面
|
3天前
|
前端开发 Java Go
从前端到后端:构建现代化Web应用的技术实践
本文将介绍如何通过前端和后端技术相结合,构建现代化Web应用的技术实践。我们将探讨前端开发、后端架构以及多种编程语言(如Java、Python、C、PHP、Go)在构建高效、可扩展的Web应用中的应用。
|
4天前
|
前端开发 JavaScript Java
npm与Maven:前端与后端构建工具深度对比学习
npm与Maven:前端与后端构建工具深度对比学习
|
4天前
|
前端开发 JavaScript API
阿珊比较Vue和React:两大前端框架的较量
阿珊比较Vue和React:两大前端框架的较量
|
4天前
|
前端开发 JavaScript NoSQL
从前端到后端:构建全栈开发者的必备技能
随着互联网技术的不断发展,全栈开发者的需求日益增长。本文将介绍如何从前端到后端,掌握全栈开发所需的关键技能,包括前端框架的选择、后端语言的学习以及数据库的应用,帮助读者构建成为全面的技术专家。
|
5天前
|
前端开发 测试技术 持续交付
《跨界合作:前端与后端如何优化协作效率》
在当今软件开发领域,前端和后端开发团队通常是分开工作的,但他们的协作质量直接影响着项目的成功与否。本文将探讨如何通过优化前端与后端的协作方式,提高开发效率和项目质量,从而实现更好的跨界合作。
|
1天前
|
监控 负载均衡 API
构建高效可靠的微服务架构:后端开发的新趋势
【5月更文挑战第19天】 在当今快速发展的数字时代,微服务架构已经成为了软件开发领域的一大热点。本文将深入探讨如何构建一个高效且可靠的微服务架构,以满足不断变化的业务需求和应对日益增长的用户需求。我们将从微服务的基本概念、优势、关键技术以及实践建议等方面进行详细阐述,为后端开发人员提供一套完整的解决方案。
|
2天前
|
监控 持续交付 开发者
构建高效微服务架构:后端开发的新范式
【5月更文挑战第18天】 随着现代软件开发的复杂性日益增长,传统的单体应用架构已难以满足快速迭代和灵活部署的需求。本文聚焦于一种新兴的解决方案——微服务架构,探讨其如何为后端开发带来革命性的改变。我们将深入分析微服务的核心概念、优势与挑战,并通过具体案例来阐述如何在实际项目中实施微服务架构。文章旨在为开发者提供一种系统化的方法,帮助他们理解并应用微服务架构,以提升系统的可维护性、扩展性和技术敏捷性。
14 2
|
2天前
|
测试技术 持续交付 API
构建高效的微服务架构:后端开发的现代实践
【5月更文挑战第18天】在数字化转型的浪潮中,微服务架构已成为企业追求敏捷、可扩展和容错能力的关键解决方案。本文将深入探讨微服务的核心概念,包括其设计原则、技术栈选择以及实施过程中的挑战与对策。通过对微服务架构实践的详细剖析,旨在为后端开发人员提供一套构建和维护高效微服务系统的实用指南。
http://www.vxiaotou.com