element-ui中表格问题

Question

如图这是element-ui 做的表格,我现在要实现点击图片显示三个按钮,这个用vue可以实现,element-ui有表格行点击方法,用v-if控制

现在的问题是我怎么控制它隐藏?就是我点击其他地方,使得控制v-if的量变为false

求大神指点

Answer 1

1.可以给那个按钮的大盒子绑定一个mouseleave事件,移除隐藏,如果要单击隐藏可以在外面套一个大的div绑定单击事件
2.还有一个方法,直接判断事件触发源是不是除了那个按钮盒子,贴上代码

$(function(){ 
$(document).bind("click",function(e){ 
var target = $(e.target); 
if(target.closest(".pop").length == 0){ 
$(".pop").hide(); 
} 
}) 
}) 

可以给盒子命名一个类为pop,利用jquery的closest()函数用于从当前匹配元素开始，逐级向上级选取符合指定表 达式的第一个元素，并以jQuery对象的形式返回是否含有.pop类

3.希望可以帮到你

Answer 2

全屏绑定一个点击事件 把v-if 绑定的值变为false 就是了啊 记得阻止事件传播就好了 我是这样想的