search

shrpne / vue-inline-svg

Dynamically loads an SVG source and inline <svg> element so you can manipulate the style of it
MIT License
175 stars 21 forks source link

how to apply fill attribute in vue3? #42

Closed 19park closed 1 year ago

19park commented 1 year ago

image I passed the fill attribute, but it doesn't change.

image

thank you.

shrpne commented 1 year ago

Attributes passed to VueInlineSvg component are only applied to the root svg node. So fill attribute on the path element is used instead of fill on the svg

There are two solutions:

  1. Edit your svg file: move fill from path to svg so applied attribute can override it.
  2. use transformSource function to edit path's fill dynamically