Vue-svg-loader: Cannot trigger @click event on svg component tag

[srbiotik]

I am using the latest version of the loader and I am loving the ease and an uncluttered zen feeling it brings comparing to just using SVG inline, not to mention the hot reload benefits.
However the v-on:click directive does not work, and bear in mind I am unsure if this is a bug, was never a feature, or my configuration is somehow off.
I configured both Webpack and Vue using offered documentation, and am able to import SVG file and place it's component tag to component HTML. It does when you use it on an SVG element/tag natively.

[mmieluch]

Have you tried using v-on:click.native?

[srbiotik]

No, I will try and report the outcome.

[FistMeNaruto]

Facing the same issue, @click.native does not work. I wrapped the svg component in a div and attached click listener on it as a temporary workaround.

[mmieluch]

Components generated by this loader are functional. I believe the only way to listen to events on functional components is to define them explicitly in the component itself. Since we don't have control over the automatically transformed SVG component, the only way to go is to wrap your components in outer tags and listen to events on the wrappers instead of components themselves.

[srbiotik]

Yeah that's not an option for me, because my SVGs are not rectangular and I want @click event in the boundary of path... I am currently bypassing it by passing a function to click prop to a custom made component which runs it in its own @click.

[visualfanatic]

@srbiotik could you try to install vue-svg-loader@next and tell me if now the click event works as expected?

[tamasfe]

@visualfanatic The vue-svg-loader@next branch seems to have solved the issue, at least it works fine for every event I throw at it.

[dcrystalj]

this solved issue for me as well.

[Kivol]

@visualfanatic Is there any schedule for it to be merged to mainstream?

[visualfanatic]

Yes, I just released it as v0.12.0 :)