学习笔记————————
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="vue.js" type="text/javascript"></script>
</head>
<body>
<!--第一部分-->
<div id="app">
<h2>当前计数:{{counter}}</h2>
<button v-on:click='add'>+</button> // v-on指令
<button v-on:click='sub'>-</button>
</div>
<!--第二部分-->
<script type="text/javascript" src="vue.js"> </script>
<script>
const app = new Vue({ //声明一个全局变量
//元素 用于选定id
el: '#app',
//保存数据 为变量counter进行初始化的赋值
data: {
counter:0
},
//建立方法,完善add和sub功能
methods:{
// +
add: function(){
console.log('add被执行');
this.counter++
},
// -
sub: function(){
console.log('sub被执行');
this.counter--
}
}
})
</script>
</body>
</html>