html
<el-table-column label="操作">
<template slot-scope="scope">
<el-dropdown @command="Operate">
<el-link :underline="false">更多<i class="el-icon-arrow-down el-icon--right"></i></el-link>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="iconfont icon-bianji"
:command="handleCommand(scope.row, 'bianji')">编辑</el-dropdown-item>
<--这里不限两个参数,多个参可以在handleCommand()中传递 -->
<el-dropdown-item icon="iconfont icon-shanchu"
:command="handleCommand(scope.row, 'shanchu')">删除</el-dropdown-item>
<-- <el-dropdown-item :command="handleCommand(scope.row, 'xxxxxx')"> ......更多选项</el-dropdown-item> -->
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
js
<script>
export default {
methods:{
// 根据唯一值执行对应操作
Operate(c) { --------------------c.row.Id是列表当前行的ID
switch (c.command) {
case "shanchu": //调用删除的方法
this.Remove(c.row.Id);
break;
case "bianji": // //调用编辑的方法
this.Edits(c.row.Id);
break;
//......更多方法
default:
return;
}
},
handleCommand(row, command) { ------------可以自己打印下
return {
row: row,
command: command
};
},
//方法
Remove(){}
Edits(){},
}
}
</script>