热门标签
热门文章
- 1Nerf学习笔记（1）--简介_nerf 的法线
- 2Session攻击手段(会话劫持/固定)及其安全防御措施_session固定
- 3NFT将变成Web3钱包？了解以太坊新标准——ERC-6551
- 4Docker部署单机rabbitmq_docker 安装离线rabbitmq
- 5测试面试题_下列选项中 用于执行测试用例或测试套件并返回测试结果的是
- 6【实用教程】使用AlphaFold2进行蛋白质结构在线预测
- 7大学生毕设神器 | 全国天气分析 全国天气爬虫 基于Python的全国天气可视化分析 基于大数据的全国天气可视化分析 基于sklearn的全国天气预测_基于python的天气预报系统设计和可视化数据分析
- 8华为云正式发布Workspace on CloudPond，一文了解所有亮点
- 9Spock测试框架中的注解使用_spock 注解@see
- 10华为OD机试C卷-- 最富裕的小家庭（Java & JS & Python & C）_在一棵树中,每个节点代表一个家庭成员,节点的数字表示其个人的财富值
当前位置: article > 正文
vue 中组件移入移出，关闭按钮使用后抖动_移入移除有抖动 vue
作者：人工智能uu | 2024-06-30 04:03:06
赞
踩
移入移除有抖动 vue
1.使用mouseenter，mouseleave，且两者不能使用相同的函数。
2.在点击关闭按钮时，设置点击延时setTimeout。
事件修饰符
在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在 methods 中轻松实现这点，但更好的方式是：methods 只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。
为了解决这个问题， Vue.js 为 v-on 提供了 事件修饰符。通过由点(.)表示的指令后缀来调用修饰符。
.stop.prevent.capture.self.once
| <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a>
<!-- 提交事件不再重载页面 --> <form v-on:submit.prevent="onSubmit"></form>
<!-- 修饰符可以串联 --> <a v-on:click.stop.prevent="doThat"></a>
<!-- 只有修饰符 --> <form v-on:submit.prevent></form>
<!-- 添加事件侦听器时使用事件捕获模式 --> <div v-on:click.capture="doThis">...</div>
<!-- 只当事件在该元素本身（比如不是子元素）触发时触发回调 --> <div v-on:click.self="doThat">...</div> |
使用修饰符时，顺序很重要；相应的代码会以同样的顺序产生。因此，用 @click.prevent.self 会阻止所有的点击，而 @click.self.prevent 只会阻止元素上的点击。
声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/人工智能uu/article/detail/771324
推荐阅读
相关标签
