Vue中事件修饰符的使用方式,计算机应届毕业生面试题

10 阅读3分钟

前端资料汇总

我一直觉得技术面试不是考试,考前背背题,发给你一张考卷,答完交卷等通知。

首先,技术面试是一个 认识自己 的过程,知道自己和外面世界的差距。

更重要的是,技术面试是一个双向了解的过程,要让对方发现你的闪光点,同时也要 试图去找到对方的闪光点,因为他以后可能就是你的同事或者领导,所以,面试官问你有什么问题的时候,不要说没有了,要去试图了解他的工作内容、了解这个团队的氛围。 找工作无非就是看三点:和什么人、做什么事、给多少钱,要给这三者在自己的心里划分一个比例。 最后,祝愿大家在这并不友好的环境下都能找到自己心仪的归宿。

开源分享:docs.qq.com/doc/DSmRnRG…

vueApp .out { background-color: lightcoral; padding: 150px; } .inner { height: 300px; background-color: lightblue; }

<button @click="btnHandler">点我

在这里插入图片描述

但是,当我们对内部标签事件添加.stop事件修饰符时,则会阻止事件向外冒泡。

<button @click.stop="btnHandler">点我

在这里插入图片描述

.prevent事件修饰符

prevent作用:阻止默认事件

比如a标签的点击跳转默认事件和我们定义的点击事件向冲突时,可以使用该事件修饰符进行阻止,使用方式和stop修饰符一致,也是在事件后加上.prevent

<a href="www.baidu.com" @click.prevent="aHandler">有问题,找度娘

在这里插入图片描述

.capture事件修饰符

.capture作用:将冒泡事件中的加.capture修饰符的事件提前到第一个执行。(官方解释:添加时间侦听器时使用事件捕获模式)

<button @click="btnHandler">点我

在这里插入图片描述

.self事件修饰符

只当事件在该元素本身(比如不是子元素)触发时触发回调

<button @click="btnHandler">点我

总结

大厂面试问深度,小厂面试问广度,如果有同学想进大厂深造一定要有一个方向精通的惊艳到面试官,还要平时遇到问题后思考一下问题的本质,找方法解决是一个方面,看到问题本质是另一个方面。还有大家一定要有目标,我在很久之前就想着以后一定要去大厂,然后默默努力,每天看一些大佬们的文章,总是觉得只有再学深入一点才有机会,所以才有恒心一直学下去。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】