Vue.js的学习1.1
1.今天学习的是关于事件的一些小东西。
昨天有学习到绑定事件可以用—> v-on:click/mouseover……
简写的:
@click=”” 推荐
事件对象:
@click="show($event)"
事件冒泡:
阻止冒泡:
a). ev.cancelBubble=true; (这个比较难记,我经常记不全)
b). **@click.stop** 推荐
2.默认行为
阻止默认行为:
a). ev.preventDefault();
b). **@contextmenu.prevent** 推荐
键盘:
@keydown $event ev.keyCode
@keyup
常用键:
看到这个的时候我真的是amazing…..老哥,厉害呀 …呀。记得以前写原生的时候可麻烦了,先获取键盘的按键,再判断啥子的….em…
回车
a). @keyup.13
b). @keyup.enter
上、下、左、右
@keyup/keydown.left
@keyup/keydown.right
@keyup/keydown.up
@keyup/keydown.down
3.属性:
用这个绑定属性 v-bind:src=””
width/height/title….
简写:
:src=”” 推荐
<img src="{{url}}" alt=""> 效果能出来,但是会报一个404错误
<img v-bind:src="url" alt=""> 效果可以出来,不会发404请求
class和style:
:class="" -----》v-bind:class=""
:style="" -----》 v-bind:style=""
:class="[red]" red是数据
:class="[red,b,c,d]"
:class="{red:a, blue:false}"
推荐:
:class="json"
data:{
json:{red:a, blue:false}
}
--------------------------
style:
:style="[c]"
:style="[c,d]"
推荐:
data:{
json:{
color:'red',
backgroundColor:'gray' 注意: 复合样式,采用驼峰命名法
}
}
:style="json"