注意:以下写法是基于RuoYi-Vue版进行处理。
1.mybatis配置文件中SQL语句
<insert id="insertBatch" parameterType="list">
insert into thirty_four_month_one_first (id, parent_id, list_name, list_value, level, indate, modify_date)
values
<foreach collection="list" item="item" index="index" separator=",">
(#{item.id},#{item.parentId},#{item.listName},#{item.listValue},#{item.level},#{item.indate},#{item.modifyDate})
</foreach>
</insert>
解析:
参数类型:List集合
Sql语句: insert into 表名 (字段名)values <foreach> (占位符进行对应赋值) </foreach>
2. Mapper接口中的抽象方法
/**
* 批量插入数据
* @param list
* @return
*/
public int insertBatch(List<ThirtyFourReportFirst> list);
3. Service层对数据进行转化
/**
* 数据提交
* @param list
* @return
*/
@Override
public Object submit(String list)
{
List<ThirtyFourReportFirst> fourReport = JSONObject.parseArray(list, ThirtyFourReportFirst.class);
// 清除表中所有记录
thirtyFourReportFirstMapper.cleanThirtyFourReportFirst();
return thirtyFourReportFirstMapper.insertBatch(fourReport);
}
解析:
JSONObject.parseArray: 我前端页面的写法是将数据转化成JSON串的形式进行传递到后台,这里我将使用JSONObject的方法将数据封装到对应的集合中。
4. Controller层拦截请求
/**
* 提交数据
* @param list
* @return
*/
@PostMapping("/submitData")
public AjaxResult submitListData(@RequestParam(value = "list",required = false) String list)
{
return AjaxResult.success(thirtyFourReportFirstService.submit(list));
}
5. api 中 .js文件 请求的方法
// 数据提交
export function submitData(params) {
return request({
url: '/thirtyFour/first/submitData',
method: 'post',
headers: { // 注意:此处的headers需要加上,否则后台接收不到传递参数
'Content-Type': 'application/x-www-form-urlencoded'
},
data: params
})
}
6. .vue文件
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
//对数据进行Json处理
var postData = new URLSearchParams();
postData.append('list',JSON.stringify(this.thirtyFourSubmitList));
submitData(postData).then(response => {
this.msgSuccess("成功");
this.getList();
});
}
});
},