<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Vue</title> </h
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Vue</title>
</head>
<body>
<div id="app" :style = "style">
<p v-if="seen">{{ message }}</p>
<p v-else>{{ message2 }}</p>
<input v-model="message">
<ol>
<li v-for="element in list">
{{element.text}}
</li>
</ol>
<button v-on:click="oclick()">点击</button>
<div @click="show($event)">点我</div>
</div>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!',
seen:true,
list:[
{text:'1111'},
{text:'2222'},
{text:'3333'}
],
message2: 'I am else',
style:{color:'red',fontSize:'30px'}
},
methods:{
oclick:function(){
alert("testOnClick");
},
show:function(ev){
alert(ev.clientX)
}
}
})
</script>
</body>
</html>