vue案例-计数器.html
生活随笔
收集整理的这篇文章主要介绍了
vue案例-计数器.html
小编觉得挺不错的,现在分享给大家,帮大家做个参考.
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div id="app"><h2>当前计数: {{counter}}</h2><!--<button v-on:click="counter++">+</button>--><!--<button v-on:click="counter--;">-</button>--><button v-on:click="add">+</button><button v-on:click="sub">-</button><!--下面是语法糖写法--><!--<button @click="sub">-</button>-->
</div><script src="../js/vue.js"></script>
<script>// 语法糖: 简写// proxyconst obj = {counter: 0,message: 'abc'}new Vue()const app = new Vue({el: '#app',data: obj,methods: {add: function () {console.log('add被执行');this.counter++},sub: function () {console.log('sub被执行');this.counter--}},beforeCreate: function () {},created: function () {console.log('created');},mounted: function () {console.log('mounted');}})// 1.拿button元素// 2.添加监听事件
</script></body>
</html>
总结
以上是生活随笔为你收集整理的vue案例-计数器.html的全部内容，希望文章能够帮你解决所遇到的问题。
- 上一篇： 声明式事务--@EnableTransa
- 下一篇： vue-router的两种模式（hash