VUE简易计数器

需要用到的标签：v-on

<div id="app">
        <div class="div">
            <button class="btntwo" v-on:click="jia">+</button>
            <span>{{span}}</span>
            <button class="btnone" v-on:click="jian">-</button>
        </div>
</div>

<!-- 引入Vue.JS -->
    <script src="../Vuejs/vue.js"></script>
    <script>
        new Vue({
            // 挂载点
            el:"#app",
            // 数据对象
            data:{
                span:1
            },
            // 事件
            methods:{
                jia:function(){
                    if(this.span<10){
                        this.span++;
                    }
                    else{
                        alert("最大值为10")
                    }
                },
                jian:function(){
                    if(this.span>0){
                        this.span--;
                    }
                    else{
                        alert("最小值为0")
                    }
                }
            }
        })
    </script>

效果如下图所示