vue中,svg图标的click事件不生效

问题情况:

vue项目中,使用svg图标,为svg图标绑定click事件,部分浏览器中点击没有反应,代码如下:

<icon name="icon_add"  @click="add(scope.$index)"> </icon>

原因:在edge内核中只有点击svg边缘部分才会触发click事件

解决办法:为svg图标外面包裹一层元素,click事件绑定在外侧元素上,修改如下:

<a href='javascript:;' @click="add(scope.$index)">
    <icon name="icon_add">
    </icon>
</a>

 

posted @ 2019-11-09 10:01  Lemoncool  阅读(7243)  评论(0编辑  收藏  举报