vue学习笔记5 v-on

v-on:click=""

我们的v-on 还有一种简单的写法，就是用@代替

 

<!-- `greet` 是在下面定义的方法名 --> <button v-on:click="greet">Greet</button>

// 在 `methods` 对象中定义方法

methods: {

greet: function (event) {

// `this` 在方法里指向当前 Vue 实例

alert('Hello ' + this.name + '!')

// `event` 是原生 DOM 事件

if (event) {

alert(event.target.tagName)

}

}

}

<div id="app">
            本场得分：{{count}}
            <hr />
            <button v-on:click="countJia">加分</button>
            <button @click="countJian">减分</button>
            <input type="text" v-on:keyUp.13="onEnter" v-model="secondCount">
        </div>
        <script type="text/javascript">
            var app = new Vue({
                el:'#app',
                data:{
                    count:1,
                    secondCount:0
                },
                methods:{
                    countJia:function(){
                        this.count++;
                    },
                    countJian:function(){
                        this.count--;
                    },
                    onEnter:function(){
                        this.count = this.count + parseInt(this.secondCount)
                    }
                }
            })
        </script>