禁用在vue 2中将点击句柄传播给子节点

Question

使用此标记

<div @click='handleClickOnDiv'>
    {{ message }}
    <i class='fa fa-plus' @click='handleClickOnI'></i>
</div>

当我点击div- 它调用handleClickOnDiv,但当我点击i- 它调用两个处理程序.

怎么处理呢？

Answer 1

尝试事件修饰符有@click,你可以做到以下几点:

<div @click='handleClickOnDiv'>
    {{ message }}
    <i class='fa fa-plus' @click.stop='handleClickOnI'></i>
</div>