Vue.js第四天

五、事件和属性

1.事件

1.1 事件简写

    v-on:click=""
    简写方式 @click=""

1.2事件对象$event

      包含事件相关信息、如事件源、事件类型、偏移量
       target 、type、offsetx

1.3事件冒泡

    阻止事件冒泡：
          a)原生js方式、依赖事件对象
          b)vue方式、不依赖事件对象
                @click.stop

1.4 事件默认行为

      阻止默认行为：
            a)原生js方式，依赖于事件对象

1.5键盘事件

      回车：@keydown.13或@kedown.enter
      上：@keydown.38 或 @keydown,up
       默认没有@keydown.a/b/c...事件，可以自定义键盘事件，也称为自定义建码别名。

1.6 事件修饰符

      .stop - 调用 event.stopPropagation()。
      .prevent - 调用 event.preventDefault()。
      .capture - 添加事件侦听器时使用 capture 模式。
      .self - 只当事件是从侦听器绑定的元素本身触发时才触发回调。
      .{keyCode | keyAlias} - 只当事件是从特定键触发时才触发回调。
      .native - 监听组件根元素的原生事件。
      .once - 只触发一次回调。

属性

2.1属性的绑定和属性的简写

    v-bind 用户属性的绑定，v-bind:属性=“”
     属性的简写：
              v-bind:src="" 简写 :src=""

2.2 class 和 style 属性

  绑定class 和 style 属性时比较特殊 语法上比较复杂

    
    
    
    
    


    

        
        
        
        
南昌
        
        
南昌1
        
        
        
北京1
        
        
北京2

        
        
itany
        
itany