84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
如图中所示,点击其他地方如何关闭这个弹出层,用jquery操作起来很简单,我想知道在vue中实现这个功能的思路是什么?
当弹出modal的时候,在modal下面写一个遮罩层overlay, css样式为position: fixed; top: 0; right: 0; bottom: 0; left: 0;并在其上面绑定一个点击事件关闭modal
position: fixed; top: 0; right: 0; bottom: 0; left: 0;
可以在全局绑定一个点击事件,在这个弹出层上阻止点击事件的冒泡,就可以达到你想要的效果。
如果引入jquery的话,就用jquery的写法在当前组件上面写,否则就自己写原生事件了。可以参考element.ui 的popover组件的相关写法63行。
当弹出modal的时候,在modal下面写一个遮罩层overlay, css样式为
position: fixed; top: 0; right: 0; bottom: 0; left: 0;
并在其上面绑定一个点击事件关闭modal可以在全局绑定一个点击事件,在这个弹出层上阻止点击事件的冒泡,就可以达到你想要的效果。
如果引入jquery的话,就用jquery的写法在当前组件上面写,否则就自己写原生事件了。
可以参考element.ui 的popover组件的相关写法63行。