关于vue+springboot批量删除遇到的问题,附上代码

js

// 批量删除
deleteBathById(){
debugger
let self=this
let ids= this.sels.map(item => item.id).join()//获取所有选中行的id组成的字符串,以逗号分隔
console.log(ids)
this.$confirm(‘此操作将永久删除该文件及其子文件, 是否继续?’, ‘提示’, {
confirmButtonText: ‘确定’,
cancelButtonText: ‘取消’,
type: ‘warning’
}).then(() => {
axios.post("/api/mmContractTemplate/deleteBathById",{ids:ids}).then(function(response){
self.loadingData();
alert(“删除成功”)
})
})
},
vue

 <div class="change">
            <el-row>
                <el-col :span="24">
                  <div class="grid-content bg-purple" style="float:left">
                     <el-button type="primary" @click="change" size="small" class="btn1" icon="el-icon-circle-plus-outline" >{{message}}</el-button>
                     <!-- 批量删除选中的框的长度等于0时不可用 -->
                     <el-button type="primary" @click="deleteBathById(sels)" :disabled="this.sels.length === 0"  size="small" class="btn1" icon="el-icon-delete" >{{message1}}</el-button>
                     <el-button type="primary" @click="application" size="small" class="btn1" icon="el-icon-success" >{{message2}}</el-button>
                     <el-button type="primary" @click=" preview " size="small" class="btn1" icon="el-icon-view" >{{message3}}</el-button>
                  </div>
                </el-col>
            </el-row>
      </div>
      <!-- 准入文件表格名称start-->
          <div class="infoTable">
                <el-table 
                    class="table_info"
                    :data="tableData"
                    border
                    stripe
                    style="width: 100%"
                    :default-sort = "{prop: 'date', order: 'descending'}"
                    :row-style="tableRowStyle"
                    :header-cell-style="tableHeaderColor"
                    :cell-style="{padding:'2px'}"
                    @selection-change="selsChange"
                    >
                     <el-table-column 
                     v-if="show2"
                     type="selection"
                     >
                    </el-table-column>
                    <el-table-column
                      prop=""
                      type="index"
                      label="序号"
                      width="80"
                      align="center"
                      font="bold"                       
                      >
                    </el-table-column>
                    <el-table-column
                      prop="mouldName"
                      label="模板名称"
                      width="225"
                      align="center">
                    </el-table-column>
                    <el-table-column
                      prop="contractType"
                      label="合同类型"
                      width="160"
                      align="center">
                      <template slot-scope="scope">
                        {{scope.row.contractType==1?'零售合同':''}}
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="templateVer"
                      label="模板版本"
                      width="160"
                      align="center">
                    </el-table-column>
                    <el-table-column
                      prop="state"
                      label="状态"
                      width="160"
                      align="center">
                      <template slot-scope="scope">
                        {{scope.row.state==1?'已应用':''}}
                        {{scope.row.state==2?'备选':''}}
                      </template>
                    </el-table-column>
                    <el-table-column
                     label="操作"
                     align="center"
                     width="160">
                     <!-- 文字居中 align="center"-->
                      <template slot-scope="scope">
                        <!-- message1编辑准入文件 -->
                          <el-link type="primary"   @click='editor(scope.row)'>{{message4}}</el-link>  |
                          <el-link type="primary"  @click="deleteRow1(scope.row,scope.$index)">删除</el-link>
                      </template>
                    </el-table-column>
                </el-table>                 
          </div>

后端
controller

@IgnoreAuth
    @RequestMapping(value = "/deleteBathById")
    public BaseResponse deleteBathById(@RequestBody HashMap<String, String> parasmap ) {
        String ids = parasmap.get("ids");
        String[] id = ids.split(",");
        int result = mmContractTemplateManager.deleteBathById(id);
        if (result > 0) {
            return baseUtilService.setResultSuccess("删除成功");
        } else {
            return baseUtilService.setResultSuccess("删除失败");
        }
    }

service

/**
  * 根据id批量删除
  * @param
  * @return
  */
 int deleteBathById(String[] id);

impl

   @Override
    @Transactional
    public int deleteBathById(String[] id) {
        return this.baseMapper.deleteBathById(id);
    }

mapper

int deleteBathById( String[] id);

xml

 <!--批量删除-->
    <delete id="deleteBathById" parameterType="java.lang.String">
        delete from mm_contract_template where mould_id in
        <foreach collection="array" item="id"  open="(" separator="," close=")">
            #{id}
        </foreach>
    </delete>

遇到请求报错Required String parameter ‘id’ is not present问题,具体解决问题如下
在这里插入图片描述
之前用的是String接收
在这里插入图片描述
所以删除不了
如果前端传入的是json数据那么后端使用
@RequestBody HashMap<String, String> map
进行接收,然后再通过map.get(“id”)获取对应的数据

如果前端传入的是正常表单数据,那么后端使用
@RequestParam(“id”) String id或者
@RequestParam(value=“id”, required = false) String id接收参数

需要注意的是,如果请求类型为delete并且参数类型不是json的话,不能使用通过表单类型提交,参数需要跟到请求url后面,并且后台使用@PathVariable进行获取参数

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值