vue @click @tap重叠事件区分方式

vue @click @tap重叠事件区分方式

目录

@click @tap重叠事件区分

click和tap事件的区别

click事件

tap事件

点透问题

@click @tap重叠事件区分

点击remove事件会触发details事件,使用@click.stop

官方介绍

<ul>     <li v-for="item in data.list" :key="item.id" @click="details(item)">         <font @click.stop="edit(item)">编辑</font>         <font @click.stop="remove(item)">删除</font>     </li> </ul> <ul>     <li v-for="item in data.list" :key="item.id" @tap="details(item)">         <font @tap.stop="edit(item)">编辑</font>         <font @tap.stop="remove(item)">删除</font>     </li> </ul> click和tap事件的区别 click事件

click事件是pc端的单机事件,但是当这个事件在移动端实现的时候,会出现延迟300ms的现象,所以移动端一般用tap来代替click。

tap事件

tap可以减少click在移动端的延迟,提高了性能。

点透问题

在同一个z轴上,z-index不同的两个元素,上面的元素是一个绑定了tap事件的,下面是一个a标签,一旦tap触发,这个元素就会display: none,而从上面的tap可以看出,有touchstart、touchend,所以会300ms之后触发click事件,而z-index已经消失了,所以,触发了下面的a的click事件,注意: 我们认为a标签默认是绑定了click事件的。而这种现象不是我们所期待的。

使用fastclick来解决移动端输入框聚焦不灵敏问题

在移动端,输入框可能会出现点击后无法输入,需要长按或者连续点击才能获得输入框的聚焦,这时候可以使用fastclick来解决这个问题。

以上为个人经验,希望能给大家一个参考,也希望大家多多支持易知道(ezd.cc)。

推荐阅读

    更改mac下svg的打开方式

    更改mac下svg的打开方式,方式,右键,在使用go pprof分析程序的时候,可以使用web方式查看函数调用,但是每次执行web命令的时候都是用sublime打

    求和快捷键技巧|求和的快捷方式

    求和快捷键技巧|求和的快捷方式,,求和的快捷方式方法一:快捷键alt+=快速输入求和公式进行求和操作技巧:1、鼠标先选择我们需要求和的单元格

    oa系统清理快捷键|oa快捷方式

    oa系统清理快捷键|oa快捷方式,,1. oa快捷方式一、如果是OA自动化办公系统运行周期不长,历史数据不多,可采用纯前台的再录入方式。 二、如果

    确定java按钮响应事件的代码

    确定java按钮响应事件的代码,,* 阅读本文可以结合最后在java登录窗口界面下面是一个链接。 是定义的容器。 容器(CP =得到内容面板); / /

    平板电脑系统怎么区分|平板电脑区别

    平板电脑系统怎么区分|平板电脑区别,,平板电脑区别区别在于14英寸的电脑性能更强劲,用的是CPU加显卡的组合,而14英寸的平板电脑性能是稍稍要

    古剑快捷键|古剑奇谭操作方式

    古剑快捷键|古剑奇谭操作方式,,古剑奇谭操作方式操作按键移动左摇杆疾跑、闪避RT防御RB瞄准按下左摇杆跳跃A探查技能B交互B轻攻击X重攻击Y

    SQL 查看触发器

    SQL 查看触发器,触发器,示例, 1、通过可视化操作来管理和查看触发器 在Microsoft SQL Server Management Studio中,选中某一数据库的某一