vue 事件修饰符

参考资料：https://www.cnblogs.com/lgnblog/p/12750071.html

@click.stop阻止点击事件继续传播

有.stop修饰符
点击do3显示3 2
点击do2显示2
点击do1显示1

没有.stop修饰符
点击do3显示3 2 1
点击do2显示2 1
点击do1显示1

<template>
    <div id="app">
        <div @click="do1()">1
            <div @click.stop="do2()">2
                <div @click="do3()">3</div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    methods: {
        do1() {
            console.log(1)
        },
        do2() {
            console.log(2)
        },
        do3() {
            console.log(3)
        },
    },
    components: {
    },
}
</script>

@click.prevent 阻止事件默认行为

方法func不会触发a链接跳转
<a href="www.baidu.com" @click.prevent="func">baidu</a>