事件修饰符 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <!-- 阻止单击事件冒泡 -->
    <a v-on:click.stop="doThis">点击</a>
    <!-- 提交事件不再重载页面 -->
    <form v-on:submit.prevent="onSubmit">点击</form>
    <!-- 修饰符可以串联 -->
    <a v-on:click.stop.prevent="doThat">点击</a>
    <!-- 只有修饰符 -->
    <form v-on:submit.prevent>点击</form>
    <!-- 添加事件侦听器时使用事件捕获模式 -->
    <div v-on:click.capture="doThis">点击</div>
    <!-- 只当事件在该元素本身 (比如不是子元素) 触发时触发回调 -->
    <div v-on:click.self="doThat">点击</div>

    <!-- 点击事件将只会触发一次 -->
    <a v-on:click.once="doThis">点击</a>
        
</body>
<script type="text/javascript" src="js/vue.js"></script>
<script type="text/javascript">
    new vue({
        el:"#app",
        methods:{
            onSubmit:function(){
                alert("aaa")
            }
        }
    })
</script>
</html>

 

posted @ 2017-09-17 21:35  Jinsuo  阅读(159)  评论(0)    收藏  举报