<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!--引入vue js 外部文件-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<h1 v-text v-on:click="greet">Hello {{obj}}!</h1>
<h2>blogger : {{blogger}}</h2>
<h2>url : {{url}}</h2>
<h2>intro :{{intro}}</h2>
</div>
<script type="text/javascript">
var vm = new Vue({
el: '#app',
data: {
blogger: "windfallsheng",
url: "https://blog.csdn.net/Silence1515",
intro: "写代码只是为了表达自己",
obj: "World",
count: 0
},
methods: {
greet: function(){
if (this.count % 2 === 0) {
this.obj = "China";
} else {
this.obj = "World";
}
console.log("obj=" + this.obj + ", count=" + this.count);
this.count++;
}
}
})
</script>
</body>
</html>