Vue入门---事件与方法详解-白红宇

一、 vue方法实现

1  2  3      4         
      5         Vue方法与事件 6         
      7          8      9     10         
     
      11             
       
      12         
     
13         23     24

二、方法传参

1  2  3      4         
      5         Vue方法与事件 6         
      7          8      9     10         
     
      11             
       
      12             
       
      13         
     
14         24     25

三、vue访问原生 DOM 事件

注意用$event获取

1  2  3      4         
      5         Vue方法与事件 6         
      7          8      9     10         
     
      11             
       
      12             
      
       13                 鼠标从我上面滑过试试14             
      
15         
     
16         29     30

四、事件修饰符

五、常用事件

　　v-on:click/mouseover......

　　简写的: @click="" 推荐

　　1、事件对象:

　　　　@click="show($event)"

　　2、事件冒泡:

　　　　阻止冒泡:

　　　　a). ev.cancelBubble=true;

　　　　b). @click.stop 推荐

　　3、默认行为(默认事件):

　　　　阻止默认行为:

　　　　　　a). ev.preventDefault();

　　　　　　b). @contextmenu.prevent 推荐

　　4、键盘:

　　　　@keydown $event ev.keyCode

　　　　@keyup

　　　　常用键:

　　　　　　回车

　　　　　　a). @keyup.13

　　　　　　b). @keyup.enter

　　　　　　上、下、左、右

　　　　　　@keyup/keydown.left // 左

　　　　　　@keyup/keydown.right // 右

　　　　　　@keyup/keydown.up // 上

　　　　　　@keyup/keydown.down // 下

一、 vue方法实现

二、 方法传参

三 、vue访问原生 DOM 事件

四、 事件修饰符

五、常用事件

二、方法传参

三、vue访问原生 DOM 事件

四、事件修饰符