以下是在 UniApp 中阻止事件冒泡的示例:
<template> <view> <button @click="outerClick">外部按钮</button> <button @click.stop="innerClick">内部按钮</button> </view> </template> <script> export default { methods: { outerClick() { console.log("外部按钮被点击"); }, innerClick() { console.log("内部按钮被点击"); } } }; </script>
在上面的示例中,当点击内部按钮时,通过 @click.stop 修饰符阻止了事件冒泡,因此不会触发外部按钮的点击事件。
同样的,你也可以在其他事件上使用 stop 修饰符,比如 @touch.move.stop、@touch.start.stop 等,根据具体的事件类型来阻止事件冒泡。
需要注意的是,UniApp 中的事件修饰符和普通的 Vue.js 事件修饰符使用方法是相同的,所以你可以借鉴 Vue.js 的文档来更深入了解事件修饰符的用法。