前后端传参

目录

一、传输接收实体数据

二、无注解传输实体参数

 三、传递文件

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<Equipment> queryWrapper = new QueryWrapper<>();
    queryWrapper.eq("equipment_type_id", equipmentTypeId);
    List<Equipment> 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);
}

如有帮助请点个小心心 ❤

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值