1-3事件深入

来源：互联网发布：mac电脑word储存位置编辑：程序博客网时间：2024/05/30 20:07

1.阻止冒泡：e.cancelBubble=true

<div class="box">    <div @click="show2()">        <input type="button" value="按钮" @click="show($event)">

//另一种方式 使用.stop  <input type="button" value="按钮" @click.stop="show()">

//不用cancelBubble    </div></div>

<script>    new Vue({        el:'.box',        data:{        },        methods:{            show: function (e) {                e.cancelBubble=true;  //阻止冒泡                console.log(1111);            },            show2: function () {                console.log(22222)            }        }    })</script>

2.使用右键

<input type="button" value="按钮" @contextmenu="show()">

使用右键并阻止右键菜单


<input type="button" value="按钮" @contextmenu="show($event)">
show: function (ev) {    ev.preventDefault();    console.log(1111);},
另一种方式阻止右键菜单
<input type="button" value="按钮" @contextmenu.prevent="show()">

0 0