Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.
1, to prevent the event bubbling
<button @click.stop="print('button')">点我试试啊</button>
2, to prevent the page jump
<a href="http://www.baidu.com" @click.prevent ="print('我是百度')">百度一下,你就知道</a>
3, attributes, and calculates attributes watch
const app=new Vue({
el:"#app",
data:{
num:1,
isRed:true,
birthday:152903215210,
person:{
name:"Jack",
age:12
}
},
computed:{
birth(){
const day=new Date(this.birthday);
return day.getFullYear()+"年"+day.getMonth()+"月"+day.getDay()+"日";
}
},
watch:{
num(val,oldval){
console.log(val,oldval)
},
person:{
deep:true,
handler(val) {
console.log(val.age)
}
}
}
});
<h1>
您的生日:{{birth}}
</h1>
<!-- watch-->
<input type="text" v-model="num">
<h1>num:{{num}}</h1>