PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > HBuilderX教程 > 正文

    HBuilder mui 手势事件

    作者:admin来源:网络浏览:时间:2020-09-30 00:07:50我要评论
    导读:在开发移动端的应用时,会用到很多的手势操作,比如滑动、长按等,为了方便开放者快速集成这些手势,mui内置了常用的手势事件,目前支持的...
    在开发移动端的应用时,会用到很多的手势操作,比如滑动、长按等,为了方便开放者快速集成这些手势,mui内置了常用的手势事件,目前支持的手势事件见如下列表:
    分类 参数 描述
    点击 tap 单击屏幕
    doubletap 双击屏幕
    长按 longtap 长按屏幕
    hold 按住屏幕
    release 离开屏幕
    滑动 swipeleft 向左滑动
    swiperight 向右滑动
    swipeup 向上滑动
    swipedown 向下滑动
    拖动 dragstart 开始拖动
    drag 拖动中
    dragend 拖动结束

    手势事件配置

    根据使用频率,mui默认会监听部分手势事件,如点击、滑动事件;为了开发出更高性能的moble App,mui支持用户根据实际业务需求,通过mui.init方法中的gestureConfig参数,配置具体需要监听的手势事件,。

    mui.init({
      gestureConfig:{
       tap: true, //默认为true
       doubletap: true, //默认为false
       longtap: true, //默认为false
       swipe: true, //默认为true
       drag: true, //默认为true
       hold:false,//默认为false,不监听
       release:false//默认为false,不监听
      }
    });

    注意:dragstart、drag、dragend共用drag开关,swipeleft、swiperight、swipeup、swipedown共用swipe开关

    事件监听

    同标准click事件一样,上述手势事件支持添加到任意DOM对象上,如下为一个示例:

    elem.addEventListener("swipeleft",function(){
         console.log("你正在向左滑动");
    });

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-146-2389-1.html
    相关热词搜索:
    下一篇:HBuilder mui ajax