Vue2

  1. 第一步先对删除或修改按钮加一个template标签,然后在加一个slot-scope="scope"属性
    在这里插入图片描述
<el-table-column
                    label="操作"
                    align="center">
                <template slot-scope="scope">
                    <el-button type="primary">修改</el-button>
                    <el-button type="danger" @click="dlt(scope.row)">删除</el-button>
                </template>
            </el-table-column>
  1. 通过scope.row就可以获取当前的行的数据。通过方法可以输出,发现获取的是一个对象,那么可以通过 对象.属性名,来获取想要的数据。
    在这里插入图片描述

参考:点我进入

Vue3

原理同Vue2
在这里插入图片描述

<el-table-column  label="操作" align="center" >
        <template #default="scope">
          <el-button type="primary" :icon="Edit" circle @click="onEdit(scope)" />
          <el-button type="danger" :icon="Delete" circle />
        </template>
      </el-table-column>
Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐