vue+elementui dropdown 下拉菜单绑定方法
Posted tuhazi
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue+elementui dropdown 下拉菜单绑定方法相关的知识，希望对你有一定的参考价值。
方法一：给el-dropdown根组件监听command ，再el-dropdown-item 绑定commandshuxing值。 methods内详细写监听对应的方法
handleCommand(command) {
if(command == ‘loginOut‘){
this.$confirm(‘are you sure loginOut?‘, ‘提示‘, {
confirmButtonText: ‘确定‘,
cancelButtonText: ‘取消‘,
type: ‘warning‘
}).then(() => {
this.$message({
type: ‘success‘,
message: ‘loginOut成功!‘
});
}).catch(() => {
this.$message({
type: ‘info‘,
message: ‘已取消loginOut‘
});
});
}
// else if(command == ‘resetPwd‘){
// this.$alert(
// `<input
// placeholder="输入名字搜索"/>`,
// ‘notice‘,
// {
// dangerouslyUsehtmlString: true,
// showClose:true,
// callback: action => {
// this.$message({
// type: ‘info‘,
// message: `action: ${ action }`
// })
// },
// }
// )
// }
},
缺点：如果在处理事件内需要弹出表单元素，则只能使用原生html，无法使用dialog。
方法二：给el-dropdown-item 绑定点击事件。但是无效果，需要用 @click.native=" name" 这样绑定才会有效。
resetPassword:function(){
this.dialogFormVisible = true
console.log("重置密码")
}
以上是关于vue+elementui dropdown 下拉菜单绑定方法的主要内容，如果未能解决你的问题，请参考以下文章
ElementUI中解决使用dropdown等弹窗时定位body而非template创建的dom节点