写一段elementui表格的删除函数
时间: 2023-02-22 08:54:43 浏览: 91
以下是一个使用 Element UI Table 组件的删除函数的示例:
```
<template>
<el-table :data="tableData">
<el-table-column prop="name" label="名称" />
<el-table-column prop="age" label="年龄" />
<el-table-column label="操作">
<template slot-scope="scope">
<el-button @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
tableData: [
{ name: '王小明', age: 18 },
{ name: '李小红', age: 20 },
{ name: '张小刘', age: 22 },
]
}
},
methods: {
handleDelete(row) {
this.tableData = this.tableData.filter(item => item !== row)
}
}
}
</script>
```
在上面的代码中,我们使用了 Element UI Table 组件和模板语法,定义了一个表格,并在最后一列添加了一个 "删除" 按钮,点击按钮会触发 `handleDelete` 函数,该函数会在数据源中移除当前行数据。
阅读全文