您的当前位置:首页vue2.0阻止事件冒泡

vue2.0阻止事件冒泡

2024-08-15 来源:乌哈旅游
vue2.0阻⽌事件冒泡

编辑 确定

出现的问题:点击picker_alert元素也会触发picker_wrap绑定的click事件解决办法:阻⽌事件冒泡

在picker_alert元素加上@click.stop

事件修饰符

在事件处理程序中调⽤ event.preventDefault() 或 event.stopPropagation() 是⾮常常见的需求。尽管我们可以在 methods 中轻松实现这点,但更好的⽅式是:methods 只有纯粹的数据逻辑,⽽不是去处理 DOM 事件细节。

为了解决这个问题, Vue.js 为 v-on 提供了 事件修饰符。通过由点(.)表⽰的指令后缀来调⽤修饰符。

.stop.prevent.capture.self.once

...

使⽤修饰符时,顺序很重要;相应的代码会以同样的顺序产⽣。因此,

...

⽤ @click.prevent.self 会阻⽌所有的点击,⽽ @click.self.prevent 只会阻⽌元

素上的点击。

因篇幅问题不能全部显示,请点此查看更多更全内容