vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件

发布时间:2019-04-02 发布网站:脚本之家
脚本之家收集整理的这篇文章主要介绍了vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件

<div class="cnblogs_code">

v-on:click/mouseover......
=""="show($event)"
= 默认行为(默认事件): 阻止默认行为: a). ev.preventDefault(); b). @contextmenu.prevent 推荐
键盘: @keydown $event ev.keyCode @keyup 常用键: 回车 a). @keyup.
13/keydown.left @keyup/keydown.right @keyup/keydown.up @keyup/keydown.down .....

 

简写的:  @click=""   推荐

<div class="cnblogs_code">

>
>

事件对象:@click="show($event)"

<div class="cnblogs_code">

window.onload='#box'
)">

事件冒泡,
阻止冒泡:
a). ev.cancelBubble=true;

<div class="cnblogs_code">

window.onload='#box'1
                    },show2:2
> >

 

b). @click.stop 推荐

<div class="cnblogs_code">

>

默认行为(默认事件):
阻止默认行为:
a). ev.preventDefault();

<div class="cnblogs_code">

window.onload='#box'1
                    }
                }
            });
        };

 

b). @contextmenu.prevent 推荐

<div class="cnblogs_code">

="show()">

键盘事件:
@keydown $event  ev.keyCode

<div class="cnblogs_code">

window.onload='#box');
                    }
                }
            });
        };

="show()">

@keyup

<div class="cnblogs_code">

window.onload=function(){
            new Vue({
                el:'#box',methods:{
                    show:function(ev){
                        alert(ev.keyCode);
                    }
                }
            });
        };

="show($event)">

 

常用键:
1、回车
a). @keyup.13
b). @keyup.enter

<div class="cnblogs_code">

window.onload='#box''您按回车了'

="show()">

 

2、上、下、左、右
@keyup/keydown.left
@keyup/keydown.right
@keyup/keydown.up
@keyup/keydown.down

<div class="cnblogs_code">

window.onload='#box'"你按了左箭头←"
="show()">

 



总结

以上是脚本之家为你收集整理的vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件全部内容,希望文章能够帮你解决vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件所遇到的程序开发问题。

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:76874919,请注明来意。
标签:vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件
猜你在找的Vue相关文章
其他相关热搜词更多
CSSHTMLNode.jscocosvue.jsrailsangularJSJsHTML5bashreactangularCSS3实现脚本依赖Luabootstrapspring问题
全站导航更多
最新Vue教程
热门Vue教程