vue+element+node如何批量删除

今天下午研究了一下 方法较简单
前端是vue+element框架 后端node.js

前端:

<el-table-column type="selection" width="55"></el-table-column>
然后给table加个方法 @selection-change="handleSelectionChange"
然后在data中定义两个空数组接受
tableChecked: [],
     ids: [],

methods定义一个方法
handleSelectionChange(val) {
     this.tableChecked = val
你可以console.log(val) 看看有没有选中到值
   },

然后创建1个批量删除的按钮
<el-col :span="24">
     <el-button type="primary" :disabled="this.tableChecked.length === 0"  @click="batchDelete(tableChecked)">批量删除</el-button>
   </el-col>

放在table外面

然后给这个按钮定义方法

methods里面

async batchDelete() {
     var ids = this.tableChecked.map(item => item._id).join()
     this.$confirm('确定要批量删除这些文章吗', "提示", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning"
     })
       .then(async () => {
         // const res = await this.$http.delete('del/'+ids);
         await this.$http.delete('del/'+ids);
         this.$message({
           type: "success",
           message: "删除成功!"
         });
         this.fetch();
       })
       .catch(() => {
         this.$message({
           type: "info",
           message: "已取消删除"
         });
       });
   },
接口自己修改






后端

app.delete('/admin/api/del/:id', async (req, res) => {
        const delId = req.params.id.split(',')
        await Article.remove({ _id: { $in: delId } });
        res.send({
            success: true
        })
    })




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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值