美文网首页
Tabbar双击事件

Tabbar双击事件

作者: 不爱敲代码的程序员 | 来源:发表于2021-07-30 11:00 被阅读0次

APP常常可以看到双击底部的某个menu,页面就会刷新。这是一种常见的操作。但如果开发者使用uniapp或者小程序,会发现,底部的tabbar是在page.json文件中配置的,但官方的api只提供了单击事件的监听,双击事件是没有的。当然有些人可能会用第三方ui框架来代替默认的导航,但实际上从性能来讲,还是默认的比较好,所以既然选择默认的tabbar,那怎么去展示出双击tabbar这个操作呢?原理简单:
在官方给的监听点击tabar的事件中做个操作,即在某个事件段内没有第二次点击,就当做是单击,一般时间设置为200ms,比较符合用户双击事件的时间。
代码如下:

onTabItemTap(e) { // tab 点击时执行,此处直接接收单击事件
            if (this.tabClick) {
                // 200ms 内再次点击 数据处理
                this.reflesh() //数据处理
            }
            this.tabClick = true
            setTimeout(() => {
                this.tabClick = false // 200ms 内没有第二次点击,就当作单击
            }, 200)
 },

当然还有其他思路,但原理基本都是在一定的时间的间隔去执行不同的事件,这样便可处理单击,双击以及多次点击的事件。

相关文章

  • Tabbar双击事件

    APP常常可以看到双击底部的某个menu,页面就会刷新。这是一种常见的操作。但如果开发者使用uniapp或者小程序...

  • 双击事件

    有些时候我们会遇到双击事件,如何设置双击事件。 在你的点击事件里写下一下判断 System.arraycopy(d...

  • 双击事件

    一、原理 1、布尔值 2、setTimeout() 二、实现代码 html: css: JavaScript: 三...

  • Android双击事件实现

    双击退出应用 双击响应事件 利用Handler控制点击事件

  • android_自定义多击事件

    自定义双击事件 点击事件:在控件上按下,离开,有瞬间的停留。 双击事件:在单位时间内,双击。 多击事件:在单位时间...

  • 常用事件

    鼠标事件 onclick 点击事件点击鼠标左键触发 ondblclick双击事件双击鼠标左键触发 onmouseo...

  • 双击打开网页

    双击事件

  • jQuery系列(四) -- 事件

    鼠标事件 .click() ==> 单击事件 .dblclick() ==> 双击事件 .mousedown() ...

  • 使用GestureDectector进行TextView、自定义

    参考Android中的双击事件使用如下代码对TextView进行双击监听,发现怎么也触发不了双击事件。 查阅资料之...

  • 实现html/js同时启用单双击事件

    在同一个dom元素同时启用了单击和双击事件时,双击会触发两次单击事件和一次双击事件,并且触发顺序是:单击1 -> ...

网友评论

      本文标题:Tabbar双击事件

      本文链接:https://www.haomeiwen.com/subject/uhrfvltx.html