如何避免面板弹出重叠
来源:互联网 发布:aphex twin 知乎 编辑:程序博客网 时间:2024/05/21 19:44
这里谈三种方法,当然使用的是路由<router-link>。<div>同样也可以控制。
在进行页面功能的实现的时候,我们常常会遇到这样的情况,点击按钮出来一个弹窗,再点击弹窗里面的内容,跳到详情页,这时问题就来了,弹窗如果不关闭,影响详情页的浏览,所以,我们要关闭弹窗!!!!!
这是场景。下面讲述方法:
1. 使用click事件,在组件之间层层传递函数,控制弹窗显示的变量favVisible的布尔值。
2. 使用路由监控,这个方法的前提条件是使用的是路由在页面里面。监控方法如下:
watch: { $route (val) { if (this.favVisible) { this.favVisible = false } }}
当然使用的是vue
3. 第三种方法,也是比较厉害的。名叫阻止冒泡。对,就是你在阻止各种点击之间乱窜的阻止冒泡方法。在vue文档里有一处定义事件处理器,里面有一个事件修饰符。甩上链接自己看:http://cn.vuejs.org/v2/guide/events.html#事件修饰符。那是阻止冒泡的方法。
上代码吧,自己看:
closeFavor (e) { if(closest(e.target, '.favorite-item')) { this.favVisible = false }}上述代码的favorite-item,就是<router-link>标签里面定义的类。这种方法好在哪里呢,就是减少了组件之间方法的层层传递。
这样就完事了,附文字一段,洗刷焦躁的心。
美在于发现,在于邂逅,是机缘。
凌晨四点钟,看到海棠花未眠。
即使和幽灵同处地狱也能心安理得;随便什么时候都能拔腿而去。
这就是我,一个天涯孤客心底所拥有的自由。
——川端康成 《花未眠》
阅读全文
0 0
- 如何避免面板弹出重叠
- 如何避免Zigbee与Wifi的信道重叠
- 如何避免Zigbee与Wifi的信道重叠
- 避免UITableViewCell重叠的解决方法
- 避免TableViewCell重叠的问题
- 避免UITableViewCell重叠的解决方法
- tabFragment切换避免页面重叠
- C#,winform,vs2005中,如何能用代码控制,使DateTimePicker自动弹出选择日期的面板?
- 避免Toast连续弹出
- 避免Toast多次弹出
- 避免内存重叠的memmove()函数
- 正确使用FragmentPagerAdapter,避免Fragment重叠问题
- IE9 菜单/弹出窗口重叠解决
- 如何调出Palette面板
- 如何避免在IE中执行window.close()后弹出一个新IE窗口
- 如何避免输入法弹出时遮挡住按钮或输入框
- android中如何避免被弹出的输入法界面遮盖主界面
- 在含有EditText的界面中,如何避免软键盘的弹出
- Android 中无法取消标题栏的问题,requestWindowFeature(Window.FEATURE_NO_TITLE);无效
- IntelliJ Idea 常用快捷键
- Android webview内存泄漏问题的解决
- ubuntu16使用命令
- VMware虚拟机克隆CentOS后网卡修改方法
- 如何避免面板弹出重叠
- 跨域资源共享 CORS 详解
- python入门系列11―——异常处理
- 应用内打开其他应用的正确姿势
- AndroidStudio 打包生成Apk
- python入门系列12―——面向对象
- java的反编译
- SpringBoot框架搭建 Hello World
- python 下划线 函数 解释