點擊手柄禁止傳播兒童在VUE 2

Question

使用這種標記

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

當我點擊div - 它調用handleClickOnDiv，但是當我點擊i - 它調用這兩個處理程序。

如何處理？

Answer 1

嘗試Event-Modifiers與@click，你可以做到以下幾點：

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