表格删除按钮功能完整版

前端程序员杨青文

已于 2022-09-06 17:24:05 修改

阅读量834

点赞数

文章标签：前端 vue.js elementui echarts

于 2022-09-06 17:04:22 首次发布

本文链接：https://blog.csdn.net/yqw13989575652/article/details/126729027

版权

本文详述如何在Vue.js项目中结合ElementUI组件库，实现表格数据行的删除功能。通过监听表格操作列的点击事件，调用删除API并更新表格数据，确保用户体验流畅。

摘要由CSDN通过智能技术生成

//HTML
<el-button
          size="mini"
          type="primary"
          @click="cutOff"
          :disabled="multiple"
          >删除</el-button
        >
   //封装的表格组件
<ShowTable
        :tableData="tableData1"
        :tableColumn="tableColumn1"
        :height="tableHeight"
        :selection="true"
        @selectionChange="radioChange"
        :selConfig="{ label: '选择', width: '150px' }"
        :pageSize="transfer.limit"
        :page="transfer.page"
      />


//script
 //简略版data
data(){
    return{
      //电气化铁路转接查询参数
      transfer: {
        page: 1,
        limit: 10,
      },
      total1：0，
      row: {},
      ids: [],
      multiple: