<el-dropdown @command="handleCommand">
<span class="el-dropdown-link">
{{ dropdownName }}
<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<div v-for="item in matchList">
<el-dropdown-item :command="beforeHandleCommand(item.id,item.name)"> {{ item.name }}</el-dropdown-item>
</div>
</el-dropdown-menu>
</el-dropdown>
<script>
export default {
data() {
return {
tableData: [{
pk_id: 1,
mname: '中国机设',
mtype: '计算机',
date: '2016-05-02',
name: '燕山大学',
}, {
pk_id: 2,
mname: '蓝桥杯',
mtype: '计算机',
date: '2016-05-02',
name: '河北大学',
}],
dropdownName: "下拉菜单",
matchList: [{
id: 1,
name: "燕山大学"
}, {
id: 2,
name: "河北大学"
}, ],
}
},
methods: {
handleCommand(command) {
console.log(command);
this.dropdownName=command.command;
this.$message("id："+command.index);
},
beforeHandleCommand(index, command) { //index我这里是遍历的角标，即你需要传递的额外参数
return {
'index': index,
'command': command
}
},
}
}
</script>