前后端传参

目录

一、传输接收实体数据

二、无注解传输实体参数

 三、传递文件

URL拼接参数（PathVariable ）

请求携带参数（RequestParam） 

---

一、传输接收实体数据

 前端请求

$.ajax({                                
    url:"people/test/delPeopleByPrimaryKey",
    type:'POST',
    contentType: "application/json; charset=utf-8",  
    dataType:'json',//json 返回值类型
    data: JSON.stringify(people),//转化为json字符串
    success:function(data){
    }
});

后端接收

 @PostMapping("/addEquipment")
    public void addEquipment(@RequestBody Equipment equipment) {
        System.out.println(equipment);
        boolean save = equipmentService.save(equipment);
    }

二、无注解传输实体参数

前端请求

虽然后台接受的是实体类但前端还是需要将实体的属性拼接再url上面

$.ajax({ 
type: 'post', 
data:null, 
url: 'http://localhost:8081/equipmentType/test/?equipmentTypeId=123', 
cache: false, 
dataType: 'json', 
success: function (data) { 
     console.log(data) 
   } 
});

后台接收

@PostMapping("/test")
public void test(AddEquipmentTypeVo equipmentType) {
    System.out.println(equipmentType);
}

 三、传递文件

html代码

​​​​​​​<form id="uploadForm">
    <input id="file" name="file" type="file"/>
    <input onclick="upload();" type="button" value="提交"/>
form>

前端请求 

let formData = new FormData();
formData.append("file", $("#file")[0].files[0]);
$.ajax({
    type: 'post',
    processData: false,//这个必须有，不然会报错
    contentType: false,//这个必须有，不然会报错
    data: formData ,
    url: 'http://localhost:8081/equipmentType/test',
    cache: false,
    dataType: 'json',
    success: function (data) {
        console.log(data)
    }
});

后台接收

@PostMapping("/test")
public void test(@RequestParam("file") MultipartFile file) {
    try {
        System.out.println(file.getBytes());
    } catch (IOException e) {
        e.printStackTrace();
    }
}

URL拼接参数（PathVariable ）

前台请求

$.get("/getEquipment/"+equipmentTypeId, {}, ret => {
    console.log(ret)
})

后台接收

/**
 * 根据设备类型id获取设备
 *
 * @return
 */
@GetMapping("/getEquipment/{equipmentTypeId}")
public void getEquipment(@PathVariable String equipmentTypeId) {
    QueryWrapper queryWrapper = new QueryWrapper<>();
    queryWrapper.eq("equipment_type_id", equipmentTypeId);
    List list = equipmentService.list(queryWrapper);
}

​​​​​​​请求携带参数（RequestParam） 

前端请求

$.post("/getTest", {equipmentType:"测试"}, ret => {
    console.log(ret)
})

后台接收

@PostMapping("/getTest")
public void getTest(  @RequestParam("equipmentType") String equipmentType) {
    System.out.println(equipmentType);
}

如有帮助请点个小心心 ❤