vue项目中批量删除功能的实现

  1. 后台管理项目中基本上都有批量删除的功能,今天来简单给大家分享一下批量删除功能的实现。话不多说上代码

  2. <a-button @click="batchDel">批量删除<a-icon type="delete"/> <a-button>

  3. js逻辑代码

  4. `

  5. data () {
    selectedRowKeys: [] // table中选中的向,
    ids : ‘’, // 定义一个存放id的容器
    }
    methods : {
    // 封装一个delete的请求
    deleteAction(url,parameter) {
    return axios({
    url: url,
    method: ‘delete’,
    params: parameter
    })
    }
    // this.url.deleteBatch 是后端删除的接口

  6. batchDel: function () {
      if(!this.url.deleteBatch){
        this.$message.error("请设置url.deleteBatch属性!")
        return
      }
      if (this.selectedRowKeys.length <= 0) {
        this.$message.warning('请选择一条记录!');
        return;
      } else {
        var ids = "";
        for (var a = 0; a < this.selectedRowKeys.length; a++) {
          ids += this.selectedRowKeys[a] + ",";
        }
        var that = this;
        this.$confirm({
          title: "确认删除",
          content: "是否删除选中数据?",
          onOk: function () {
            that.loading = true;
            deleteAction(that.url.deleteBatch, {ids: ids}).then((res) => {
              if (res.success) {
                that.$message.success(res.message);
                that.loadData();
                that.onClearSelected();
              } else {
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.loading = false;
            });
          }
        });
      }
    },
    

    }

  7. `

  8. 如果对您有帮助,请关注一下 谢谢

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值