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>
目录
相关文章
|
8天前
|
缓存 JavaScript 前端开发
2024 前端高频面试题之 Vue 篇
2024 前端高频面试题之 Vue 篇
26 8
|
1天前
|
JavaScript 前端开发 Java
基于SpringBoot+Vue+uniapp的在线开放课程的Web前端的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的在线开放课程的Web前端的详细设计和实现(源码+lw+部署文档+讲解等)
|
3天前
|
JavaScript 前端开发 API
【前端--Vue】组件之间的多种通信方式,一文彻底搞懂组件通信!
【前端--Vue】组件之间的多种通信方式,一文彻底搞懂组件通信!
【前端--Vue】组件之间的多种通信方式,一文彻底搞懂组件通信!
|
3天前
|
资源调度 JavaScript 前端开发
【前端开发---Vue2】史上最详细的Vue入门教程(六) --- 工程化开发和脚手架、组件注册
【前端开发---Vue2】史上最详细的Vue入门教程(六) --- 工程化开发和脚手架、组件注册
【前端开发---Vue2】史上最详细的Vue入门教程(六) --- 工程化开发和脚手架、组件注册
|
3天前
|
JavaScript 前端开发 程序员
【前端开发---Vue2】史上最详细的Vue入门教程(五) --- 细讲‘生命周期’
【前端开发---Vue2】史上最详细的Vue入门教程(五) --- 细讲‘生命周期’
【前端开发---Vue2】史上最详细的Vue入门教程(五) --- 细讲‘生命周期’
|
3天前
|
缓存 自然语言处理 JavaScript
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(四)
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(四)
|
3天前
|
前端开发 JavaScript 程序员
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(三)
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(三)
|
3天前
|
Web App开发 JavaScript 前端开发
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(一)
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(一)
|
3天前
|
存储 JavaScript 前端开发
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(二)
【前端开发---Vue2】史上最详细的Vue2入门教程,从基础到进阶带你彻底掌握Vue(二)
|
9天前
|
前端开发 网络架构
1天搞定SpringBoot+Vue全栈开发 (8)前端路由VueRouter(进行组件切换)
1天搞定SpringBoot+Vue全栈开发 (8)前端路由VueRouter(进行组件切换)