JSFiddle - React, Tailwind, and code Playground

by edith_tang

HTML

<div id="app">
  <button @click="++counter">
    增加数值
  </button>
  <button @click="handleAdd()">
    + 1
  </button>
  <button @click="handleAdd(10)">
    + 10
  </button>
  <br>
  点击次数：{{ counter }}
</div>

CSS

button {
  border: none;
  background-color: pink;
  color: #fff;
  padding: 5px 10px;
  cursor: pointer
}

JavaScript

var app = new Vue({
	el: '#app',
  data:{
  	counter: 0
  },
  methods: {
  	handleAdd: function(count) {
    	count = count ||  1;
      this.counter += count;
      console.log(count);
    }
  }
})