vue中，svg图标添加click事件，部分浏览器不生效

vue项目中，使用svg图标，可是发现，为svg图标绑定click事件时，部分浏览器会出现，点击没有反应的状况，代码以下：

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

后来发现，在edge内核中只有点击svg边缘部分才会触发click事件

 

因此解决办法以下：为svg图标外面包裹一层元素，click事件绑定在外侧元素上

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