前端Get Post Put Delect请求 传参数 不传参数给后端

Get请求不传参、Get请求传不是实体类的参数、Get请求传实体类的参数

Post 请求不传参数、Post请求传不是实体类的参数、Post请求传实体类的参数  总是分不清,其中Delect 请求使用的地方很少就先记录Delete请求吧

Delect 删除

删除

前端

<el-button type="text" @click="handleDel(scope.row.id)">删除</el-button>/*** 删除单条数据*/handleDel(id) {this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {type: 'warning'}).then(() => {del(id).then(res => {})})},

前端跳后端

/*** 删除单条数据* @param id 主键值*/
export function del(id) {return request({url:define.api+'/user/' + id,method: 'DELETE'})
}

后端

    /*** 删除* @param id 主键*/@DeleteMapping("/{id}")@DSTransactionalpublic ActionResult delete(@PathVariable("id") String id){Userentity = service.getInfo(id);if(entity!=null){service.delete(entity);}return ActionResult.success("删除成功");}

Get请求

Get请求加一个不是实体类的参数--通过id 查详情

前端

    /*** 初始化表单数据* @param id 主键值* @param isDetail 是否是详情页面,控制是否可编辑*/init(id, isDetail) {this.dataForm.id = id || 0;this.visible = true;this.isDetail = isDetail || false;this.$nextTick(() => {this.$refs['elForm'].resetFields();if (this.dataForm.id) {this.loading = true//加载表单数据getInfoToEdit(this.dataForm.id).then(res => {this.dataInfo(res.data)this.loading = false})} else {this.clearData(this.dataForm)}});this.$store.commit('generator/UPDATE_RELATION_DATA', {})},

前端跳后端

/*** 获取表单详细(编辑页面调用)*/
export function getInfoToEdit(id) {return request({url: define.api+'/user/' + id,method: 'GET'})
}

后端

@RestController
@RequestMapping("/user")
public class UserController {  /*** 根据id获取表单信息(编辑表单)* @param id 主键*/@GetMapping("/{id}")public ActionResult<UserVo> info(@PathVariable("id") String id){User entity = service.getInfo(id);UserVo vo = JsonUtil.getJsonToBean(entity, UserVo.class);return ActionResult.success(vo);}
}  

Get请求加多个不是实体类的参数--前端有模糊查询

前端

//执行情况getExecutionRepairMonth(startDay,endDay){getExecutionRepairMonth(startDay,endDay).then(res=>{this.listData = res.data.map(item=>{return {name:item.name,value:item.num}});})},

前端跳后端

export function getExecution(startDay,endDay) {return request({url: define.api + `/repairMonth/getExecution?startDay=${startDay}&endDay=${endDay}`,method: 'get',})
}

后端

@RestController
@RequestMapping("/repairMonth")
public class RepairDayController {/*** @description: 通过检修计划编号 获取详情*/@GetMapping("/getExecution")public ActionResult getExecution(String startDay,String endDay){}
}

Post请求

Post请求加一个是实体类的参数--前端有模糊查询返回List

前端

      /*** 初始化加载列表数据*/initData() {this.listLoading = true;let _query = {...this.listQuery,...this.query,menuId: this.menuId};// 调用查询列表数据api接口listOLoadAnalysis(_query).then(res => {var _list =[];for(let i=0;i<res.data.list.length;i++){let _data = res.data.list[i];_list.push(_data)}this.list = _listthis.total = res.data.pagination.totalthis.listLoading = false})},

前端跳后端

/*** 查询列表数据* @param data 查询条件参数对象*/
export function listOLoadAnalysis(data) {return request({url: define.api+'/user/getList',method: 'POST',data})
}

后端

@RestController
@RequestMapping("/user")
public class UserController {   /*** 列表 表数据获取(带分页)* @param userQueryVO 查询条件对象*/@PostMapping("/getList")public ActionResult list(@RequestBody UserQueryVO userQueryVO ){}}

Put请求

Put请求携带实体类的参数---更新数据保存接口

前端

<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail"> 确 定</el-button>/*** 表单提交方法,会先进行表单数据校验*/dataFormSubmit() {this.$refs['elForm'].validate((valid) => {if (valid) {this.request()}})},/*** 表单提交调用api接口方法*/request() {var _data = this.dataList()if (!this.dataForm.id) {// 表单新增保存addOLoadAnalysis(_data).then((res) => {this.$message({message: res.msg,type: 'success',duration: 1000,onClose: () => {this.visible = falsethis.$emit('refresh', true)}})})} else {// 表单修改保存updateOLoadAnalysis(this.dataForm.id, _data).then((res) => {this.$message({message: res.msg,type: 'success',duration: 1000,onClose: () => {this.visible = falsethis.$emit('refresh', true)}})})}},

前端跳后端

/*** 新增表单保存数据* @param data 提交的表单对象*/
export function addOLoadAnalysis(data) {return request({url: define.api+'/user',method: 'POST',data})
}/*** 修改表单保存数据* @param data 提交的表单对象*/
export function updateOLoadAnalysis(id, data) {return request({url: define.api+'/user/' + id,method: 'PUT',data})
}

后端

@RestController
@RequestMapping("/user")
public class UserController {/*** 更新数据保存接口** @param id 主键* @param oLoadAnalysisVO 表单信息*/@PutMapping("/{id}")@DSTransactionalpublic ActionResult update(@PathVariable("id") String id,@RequestBody @Valid UserVo userVo){}}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/90239.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

三、git的安装和配置

一、安装 1.官网下载&#xff1a;https://git-scm.com/download 下载最新版本&#xff0c;点击红框或篮筐处即可 2.点击下载好的安装包安装这个软件 3.一直点击next&#xff0c;直到出现install&#xff0c;点击install&#xff0c;安装完成后点击finish&#xff1a; 下载完成…

利用maskrcnn来实现目标检测与追踪

首先下载源代码仓库&#xff0c;链接地址如下&#xff1a; maskrcnn 能够实现的效果如图所示&#xff1a; 该存储库包括&#xff1a; 基于FPN和ResNet101构建的Mask R-CNN的源代码。MS COCO 的训练代码MS COCO 的预训练砝码Jupyter 笔记本&#xff0c;用于可视化每一步的检测…

常用音频接口:TDM,PDM,I2S,PCM

常用音频接口&#xff1a;TDM&#xff0c;PDM&#xff0c;I2S&#xff0c;PCM_tdm音频_沙漠的甲壳虫的博客-CSDN博客 I2S/PCM接口及音频codec_音频pcm接口模块设计-CSDN博客 2个TDM8功放调试ing_周龙(AI湖湘学派)的博客-CSDN博客 数字音频接口时序----IIS、TDM、PCM、PDM_td…

数字乡村包括哪些方面?数字乡村应用介绍

数字乡村是指利用物联网、数字化和智能化技术&#xff0c;借助现代数字智能产品、高效信息服务和物联网基础设施&#xff0c;以提高农村居民生活质量&#xff0c;助力拓展经济发展前景。 创建数字村庄有助于缩小城乡社区之间的差距&#xff0c;保障每个人都能平等地享受科技发展…

[H5动画制作系列] 路径引导动画 Demo

代码参考1: <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>路径引导动画 Demo1</tit…

目标检测YOLO实战应用案例100讲-面向辅助驾驶的道路目标检测

目录 前言 国内外研究现状 机器学习目标检测算法研究现状

简化任务调度与管理:详解XXL-Job及Docker Compose安装

在现代应用程序开发中&#xff0c;任务调度和管理是至关重要的一部分。XXL-Job是一个强大的分布式任务调度平台&#xff0c;它使得任务的调度和管理变得更加轻松和高效。本文将介绍XXL-Job的基本概念&#xff0c;并详细演示如何使用Docker Compose进行快速安装和配置。 什么是X…

51单片机实训项目之产品数量计数器

/********************************************************************************* * 【实验平台】&#xff1a; QX-MCS51 单片机开发板 * 【外部晶振】&#xff1a; 11.0592mhz * 【主控芯片】&#xff1a; STC89C52 * 【编译环境】&#xff1a; Keil μVisio3 * 【程序…

文件内容显示

目录 1.浏览普通文件 1.1. 文件内容查看 1.1.1. cat 命令 例&#xff1a; 1.1.2 扩展tac命令&#xff1a; 1.1.3. more 命令 1.1.4. less命令 1.1.5. head命令 1.1.6. tail命令 1.2. 文件属性信息查看 1.2.1. file 命令 1.2.2. stat 命令 2. 文件内容过滤…

FileManager/本地文件增删改查, Cache/图像缓存处理 的操作

1. FileManager 本地文件管理器&#xff0c;增删改查文件 1.1 实现 // 本地文件管理器 class LocalFileManager{// 单例模式static let instance LocalFileManager()let folderName "MyApp_Images"init() {createFolderIfNeeded()}// 创建特定应用的文件夹func cr…

ubuntu22.04使用共享文件设置

从ubuntu20.04开始&#xff0c;设置共享文件就很麻烦 第一步&#xff1a; 安装samba&#xff1a; sudo apt install samba第二步; 创建一个共享文件夹 我以桌面Desktop为例子 第三步&#xff1a; 设置密码&#xff1a; sudo smbpasswd -a ygc第四步&#xff1a; sudo vim …

贪心算法-点灯问题

1、题目描述 给定一个字符串str&#xff0c;只由 ‘X’ 和 ‘.’ 两种字符构成。‘X’ 表示墙&#xff0c;不能放灯&#xff0c;点亮不点亮都可&#xff1b;’.’ 表示居民点&#xff0c;可以放灯&#xff0c;需要点亮。如果灯放在i位置&#xff0c;可以让 i-1&#xff0c;i 和…

WordPress主题开发( 十二)之—— 主题的functions.php

WordPress主题开发&#xff08; 十&#xff09;之—— 主题的functions.php 介绍使用functions.php vs. 插件创建和使用functions.php在functions.php中的常见用途1. 使用WordPress钩子2. 启用WordPress功能3. 定义可重用的函数4. 添加自动Feed链接5. 自定义导航菜单6. 文本域加…

IP归属地应用的几个主要特点

作为一款优秀的IP地址定位工具&#xff0c;主题IP归属地的应用无疑是最好的选择之一。该应用可以将您需要查询的IP地址快速定位到所在的具体物理位置&#xff0c;并提供详细的地址和地图信息。接下来&#xff0c;让我们一起来看一看IP归属地应用的几个主要特点&#xff1a; 1. …

Vulkan-着色器及编译SPIR-V

1.着色器模块介绍 Vulkan着色器代码一定要用字节码格式&#xff0c;而不是人类可读的语法如GLSL和HLSL。这个字节码就是SPIR-V&#xff0c;设计用于Vulkan和OpenCL。这是一个可以用于编写图形和计算着色器的格式&#xff0c;但是我们主要关注的是Vulkan的图形管线。使用字节码格…

数学建模常用模型

作为数学建模的编程手还掌握一些各类模型常用算法&#xff0c;数学建模评价类模型、分类模型、预测类模型比较常用的方法总结如下&#xff1a; 接下来对这些比较典型的模型进行详细进行介绍说明。 一、评价模型 在数学建模中&#xff0c;评价模型是比较基础的模型之一&#x…

基于微信小程序快递取件上门预约服务系统设计与实现(开题报告+任务书+源码+lw+ppt +部署文档+讲解)

文章目录 前言运行环境说明用户的主要功能有&#xff1a;管理员的主要功能有&#xff1a;具体实现截图详细视频演示代码参考论文参考源码获取 前言 &#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者&#xff0c;…

蓝桥等考Python组别六级007

第一部分:选择题 1、Python L6 (15分) 运行下面的程序,输入5,结果是( )。 n = int(input()) if n > 10: print(A) else: if n > 5: print(B) else: print(C) ABC不输出任何内容正确答案:

基于Spring Boot的宠物咖啡馆平台的设计与实现

目录 前言 一、技术栈 二、系统功能介绍 用户信息管理 看护师信息管理 宠物寄养管理 健康状况管理 点单 宠物体验 三、核心代码 1、登录模块 2、文件上传模块 3、代码封装 前言 随着信息技术在管理上越来越深入而广泛的应用&#xff0c;管理信息系统的实施在技术上已…

vlc将本地文件推流成ts实时流

推流 打开vlc &#xff0c;打开 媒体----打开网络串流 选择文件选项卡&#xff0c;打开本地文件 点击添加&#xff0c;选择本地的mp3文件 选择串流 点击下拉框&#xff0c;选择udp&#xff0c;点击右边的【添加】按钮 输入媒体流输出地址&#xff0c;点击【下一个】 选择正确的…