<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="vue.js" type="text/javascript" charset="utf-8"></script>
<link href="./02.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="vue-app03">
<p>My name is : {{age}}</p>
<button @click.once="add(1)">长一岁</button>
<div id="a" v-on:mousemove="takeXY">
{{x}} , {{y}} -
<span v-on:mousemove="stopMoving">stopMoving</span>
<span v-on:mousemove.stop="">stopMoving</span>
</div>
<a href="http://www.baidu.com" v-on:click.prevent="alert()">the new step</a>
</div>
<script src="event%20adj.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>
new Vue({
el:"#vue-app03",
data:{
age:30,
x:0,
y:0,
},
methods:{
add:function(inc){
this.age+=inc;
},
takeXY:function(event){
this.x=event.offsetX;
this.y=event.offsetY;
},
stopMoving:function(event){
/*
阻止冒泡事件
*/
event.stopPropagation();
},
alert:function(){
alert("hello");
}
}
})