使用 uni-app 开发app时 中使用的 @longpress 含义及使用方法

学习目标:

目标:

了解 @longpress 事件的含义及使用方法


学习内容:

内容:

  1. @longtap, @longpress 都代表长按事件
  2. 在浏览器上,longtap 事件会覆盖@longpress;
  3. 在手机端的时候,2个事件都存在,但是会报警告。
  4. 注意: longtap已经不在使用,所以推荐使用longpress。
  5. 长按操作: 手指按在持续一段时间,并且没有松开。 对应方法 onLongPress
  6. 按下操作: 刚刚手指接触到触摸屏的那一刹那,就是触的那一下。 对应方法 onDown
  7. 按住操作: 手指按在触摸屏上,它的时间范围在按下起效,在长按之前。对应方法 onShowPress
  8. 注意: 调用 onLongPress 事件之前一定会执行一次按住(onShowPress)事件。

总结:

知识小结:

  • 1、使用方式
 <template>
    <view>      
        <view @longpress="longtap" class="longtap" @click="click">长按触发事件</view>
        <view  v-show="show">
            长按触发弹窗,弹窗出现
        </view>
    </view>
</template>
  • 2、开发uni-app 时,用户操作所对应调用的其它几种方法:
    (1)、 抛掷操作(onFling): 手指在触摸屏上迅速移动,并松开的动作。
    (2)、 滚动操作(onScroll): 手指在触摸屏上滑动。
    (3)、 抬起操作(onSingleTapUp):手指离开触摸屏的那一刹那。

  • 3、注: 任何手势动作都会先执行一次按下(onDown)动作。

  • 4、调用 按住(onShowPress)事件和按下(onDown)动作之后都会执行一次抬起(onSingleTapUp)事件。

  • 5、调用 滚动事件(onScroll)之后不会执行抬起(onSingleTapUp)操作。

  • 6 、调用 长按事件(onLongPress)之后不会执行抬起(onSingleTapUp)操作。

  • 7、调用 抛掷(onFling)事件之后不会执行抬起(onSingleTapUp)操作。

猜你喜欢

转载自blog.csdn.net/YHLSunshine/article/details/131817190