当前位置:   article > 正文

Vue中的event阻止事件冒泡、默认事件_vuedraggable阻止事件冒泡

vuedraggable阻止事件冒泡

vue的事件对象:

@dragstart=’drag(event)′,在函数中传evevt ,函数中接收一下,事件对象就有了。

  1. <div class="select-item" draggable='true' @dragstart='drag($event)' v-for="item in items">{{item.name}} //传输事件对象
  2. </div>
  1. <script>
  2. var dom;
  3. export default{
  4. data(){
  5. return{}
  6. },
  7. methods: {
  8. drag:function(event){ //接收事件对象
  9. dom = event.currentTarget;
  10. }
  11. }
  12. }
  13. </script>

vue中阻止事件冒泡

1、@click=’show($event)’ 有了事件对象,函数可以利用原生中的 event.cancelBubble=true;

2、@click.stop=’show()’ 只要在事件后面加 .stop 就可以阻止事件冒泡

vue的中阻止默认事件

1、@click=’show($event)’ 有了事件对象,函数就可以利用原生中的 event.preventDefault();

2、@click.prevent=’show()’ 只要在事件后面加.prevent 就可以阻止默认事件

vue的键盘事件:

@keydown=’show()’,我们传个$event 也可以在函数中获 event.keyCode 。

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/AllinToyou/article/detail/79392
推荐阅读