Vue批量删除表格中的多条记录

Vue批量删除表格中的多条记录

《Vue批量删除表格中的多条记录》
选择多条记录,点击删除按钮调用onDelete方法进行删除

<table-buttons>
        <div slot="info">
          <span>已选 { { multipleSelection.length}} 条记录</span>
        </div>
        <div slot="buttons">
          <el-button @click="toAdd" type="text" icon="el-icon-plus">新增</el-button>
          <el-button type="text" @click="onDelete" icon="el-icon-delete" v-if="multipleSelection.length >0 ">删除
          </el-button>
          <el-button type="text" icon="el-icon-delete" v-else disabled>删除</el-button>
        </div>
      </table-buttons>

删除方法代码

      /** * 删除 */
    onDelete (row) { 
      let params = { 
        ids: []
      }
      if (row.id) { 
        params.ids.push(row.id)
      } else { 
        this.multipleSelection.some(item => { 
          params.ids.push(item.id)
        })
      }
      deleteOne(params).then(resp => { 
        if (resp.status === 200) { 
          this.$message({ 
            type: 'success',
            message: '删除成功'
          })
          this.loadData() // 加载数据
        } else { 
          this.$message({ 
            type: 'warning',
            message: '删除失败'
          })
        }
      })
    }

成功删除后的提示
《Vue批量删除表格中的多条记录》

    原文作者:_K_K_
    原文地址: https://blog.csdn.net/m0_47469819/article/details/108036101
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞