v-on的基本使用 

<!DOCTYPE HTML>
<HTML>
<head>
  <title></title>

</head>
<body>
<div id="app">
  <h2>{{counter}}
  </h2>
<!--  v-on:=@ v-bind=:-->
  <button v-on:click="counter++">+</button>
  <button v-on:click="counter--">-</button>
  <button v-on:click="increment">+</button>
  <button v-on:click="decrement">-</button>
</div>
<script src="../vue.js"></script>
<script>
  const vm = new Vue({
    el:'#app',
    data:{
      message:'ds',
      counter:0
    },
    methods:{
      //增强写法
      increment(){
        this.counter++

      },
      decrement(){
        this.counter--

      },
    }
  })

</script>
</body>
</HTML>

 

posted @ 2021-04-09 10:10  好吗，好  阅读(47)  评论(0)    收藏  举报