Vue+JavaSpingBoot笔记(1)

一、前后端通信参数问题

1.集合【字典】类型

Vue前端传递参数:

export default {methods: {
test(){// 将 filteredData 中的每一行值放入 newData 对象数组中 const newData = filteredData.map(item => ({key1: item.Value1,key2: item.Value2,key3: "测试"}));request({url: '/url/ag',method: 'post',data: newData}).then(res => {if (res.code == 200) {this.$modal.msgSuccess('成功！')this.getList()}})}}
}

java后端接收参数
    controller:

    @PostMapping("/ag") // 处理Post请求public ResultBean again(@RequestBody List<Map<String,Object>> requestBody){service.方法(requestBody);}

  service:

 List<Map<String,Object>> maplist 直接遍历使用

  2.字典+集合类型

Vue前端:

export default {methods: {
test(){// 字典数据const dictData = {To:   值1,Key1: 'A',Key2: 值2,};// 列表数据示例  const listData = [];request({url: '/url/ag',method: 'post',data: {  dictData: dictData,  listData: listData    }  }).then(res => {if (res.code == 200) {this.$modal.msgSuccess('成功！')this.getList()}})}}
}

java后端
    controller: 
   

@PostMapping("/ag") // 处理POST请求public ResultBean move(@RequestBody Map<String, Object> requestBody) {Map<String, Object> dictData = (Map<String, Object>) requestBody.get("dictData");List<String> listData = (List<String>) requestBody.get("listData");Sservice.方法(dictData,listData);}

service:

 Map<String,Object> map, List<String> list 直接遍历使用