Vue3+el-table 获取当前行数据

最新推荐文章于 2025-02-22 15:00:00 发布

原创最新推荐文章于 2025-02-22 15:00:00 发布 · 2.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

这篇文章介绍了如何在ElementUI的表格组件中利用插槽(slot)来获取当前行的数据，以便实现对用户信息的编辑(editUser)和删除(deleteUser)操作。通过点击按钮触发具体的方法，实现了前端交互中的常见功能。

借助插槽获取当前行数据，方便增删改查

<el-table-column label="操作">
    <template slot-scope="scope">
        <el-button type="primary" @click="editUser(scope.row)"
            >修改</el-button>
        <el-button type="danger" @click="deleteUser(scope.row)"
            >删除</el-button>
    </template>
</el-table-column>