页面结构
<el-dropdown @command="handleCommand" >
<span class="el-dropdown-link" >
<el-avatar class="user_avatar" :src="this.$store.state.user_avatar"></el-avatar>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="musicLove">喜欢列表</el-dropdown-item>
<el-dropdown-item command="massage">消息中心</el-dropdown-item>
<el-dropdown-item command="history">播放历史</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
JS结构
methods:{
//通过传入参数形式，回调函数判断下拉菜单item
handleCommand(command){
if (command=="musicLove"){
this.userLove()
}
if (command=="massage"){
this.userMassage()
}
if (command=="history"){
this. userHistory()
}
},
userLove(){
console.log('喜欢列表')
},
userMassage(){
console.log("消息记录")
},
userHistory(){
console.log("历史记录")
},