Vue学习记录

new Vue({

      el:"#id",    //绑定元素

      data:{        // 数据

      },

      methods:{   //方法集

      }

});

一、针对标签内容  直接 {{  lab  }}  ,若是须要调用方法  {{ function() }}

二、针对属性能够用，属性绑定：  v-bind:href="website"  注意此处没有 {{  }}双括号

三、针对标签， v-html="websiteTag" 此处也没有双   {{  }｝注意此处没有 {{  }}双括号

四、针对事件，v-on:click="age++"   针对简单的已存在的数值属性，能够直接使用表达式，age++,  age-- ;    可是复杂的方法就须要从新定义了  并使用 v-on:click="function"。 这里的function能够带括号也能够不带括号，可是若是有参数就必需要带括号和参数了。v-on: 能够变成 @

 五、事件修饰符  stop(阻止事件冒泡)    once(一次)    prevent(阻止默认事件) 等等不一一列举。键值修饰符：例如 tab  enter  等等不一一列举  特殊状况：双按键  例如 alt+enter   v-on:click.alt.enter   单按alt无论用，单用enter也不行，一块儿按才执行。

六、双向数据绑定（输入输出绑定）：必定是跟input、  select、  textarea等等有关,换句话说必定是跟输入有关。    这里介绍一个新的语法  ref="attribute"  ，咱们在input里使用<input ref="name" />     this.$refs.name.value  ，另外一种方式 v-model="name"