vue in, svg icon to add a click event, some browsers do not take effect

vue project using svg icon, but found that when binding click events svg icons, some browsers will appear, click no response, the code is as follows:

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

Later we found that only clicks svg edge portion of the event will trigger click in the edge kernel

 

So the solution is as follows: for the outside wrapped in a layer of the element svg icon, click on the outside of the event binding element

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