vue前端,通过Checkbox选中el-table里的数据,插入到数据库中

这几天遇到了一个难题,就是如题目所示,需要把选中的el-table表格里的数据提交到数据库里,经过了几天的折磨,总算是完成了。现在把从前端到一直提交到数据库里的全过程以及使用的方法写出来,帮助有疑问的小伙伴少走弯路。

1.前端vue代码

UpOne() {
        let that = this;
       
        var a = this.tableDataSelections  //这个就是我们选中的el-table表格里的数据
       
        console.log(a);
        that.$axios({
          method: 'post',
          url: '/Query/upone',
          data:  a
        }).then((result) => {
          console(result)   //实际上我这次没有返回值给前端,所以这里没有值
        })
      },

 不懂我上图中   this.tableDataSelections  是怎么来的小伙伴可以查看我的另一篇文章

VUE中获取TABLE的SELECTION选中的数据_guapilixianghe的博客-CSDN博客_vue获取选中的table行数据

this.tableDataSelections 里面的数据格式是这样的:

[{ date: '2016-05-03', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' },

{ date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }]

2.java后端代码

2.1 controller层代码

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;//导入的包
//这个用来查看传入的参数
private static final Logger logger = LoggerFactory.getLogger(QueryController.class);

    @RequestMapping(value="/upone",method={RequestMethod.POST})
    @ResponseBody
    @CrossOrigin("*")
    public void saveUploadList(@RequestBody List<Upload> upload) {

        //Upload是实体类
          logger.info("传入的参数是{}",upload);
           //格式是这样的:
           //[Upload{name='王小虎', address='北京'},Upload{name='王小龙', address='上海'}]
          queryService.upone(upload);


    }

这里遇见了其他问题:JSON parse error: Cannot deserialize value of type `java.sql.Date`

因为我的实体类里有时间的属性,这个是时间的格式没有转换造成的:

一是把java.sql.Date改成Date,导入的包:import java.util.Date;

二是在时间上面加上注解:

@JsonFormat(locale="zh", timezone="GMT+8", pattern="yyyy-MM-dd HH:mm:ss")
这样就解决问题了。

2.2 service层

void upone(List<Upload> upload);

2.3 serviceimpl层

@Override
    public void upone(List<Upload> upload) {

        queryMapper.upone(upload);
    }

2.4 mapper层

@Insert({"<script>" ,
            "INSERT INTO Upload(name,address)  values "+
            "<foreach collection='upload' item='item'  separator=','>" +
            " (#{item.name,jdbcType=VARCHAR},#{item.address,jdbcType=VARCHAR})"+
            "</foreach>"+
            "</script>"})
    void upone(@Param("upload") List<Upload> upload);

这样是可以插入的,但是有个问题,就是它只能插入一条数据,就像这样:

[Upload{name='王小虎', address='北京'}]

如果list里有两条数据,就不能插入了。暂时还没解决,如果谁有办法可以教我一下。

--------------------------------------------------------------

经过我的研究发现,原来是oracle不支持这种上传格式:insert into xxx values (xxx,xxx),(xxx,xxx)

上面这种mysql可以用,但是oracle不行。所以你要是oracle的库得用这种

   @Insert({"<script>" ,
            "INSERT INTO Upload(name,address) "+
            "<foreach collection='upload' item='item' index='index' separator='UNION ALL'>" +
            " (select #{item.name,jdbcType=VARCHAR},#{item.address,jdbcType=VARCHAR}from dual)"+
            "</foreach>"+
            "</script>"})
    void upone(@Param("upload") List<Upload> upload);

当然了,如果你要是用的是xml文件可能更方便一点。可以去看看其他人的。

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值