<body>
<div id="app">
<div @click="divClick">
123456789
<!-- 1 .stop修饰符的使用 阻止冒泡 -->
<button @click.stop="btnClick">按钮</button>
</div>
<!-- 2 .prevent修饰符的使用 阻止默认行为 -->
<form action="百度">
<input type="submit" value="提交" @click.prevent="submitClick">
</form>
<!-- 3 .once修饰符的使用 只执行一次 -->
<input type="submit" value="提交2" @click.once="submit2Click">
</div>
<script src='https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js'></script>
<script>
const app = new Vue({
el: '#app',
data: {
},
methods: {
divClick() {
console.log("div被点击了");
},
btnClick() {
console.log('btn被点击了');
},
submitClick() {
console.log("submit");
},
submit2Click() {
console.log("只提交一次");
}
}
})
</script>
</body>