Using with an HTML Element

[bknill]

Hi!

I'm trying to use this component with React Icons.

React Icons renders the icon as an SVG in the page, i.e.

<svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="alert" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg>

I'm now trying to render this in aframe with this component i.e.

svg: {src: '#alert'}

but get this error:

TypeError: Cannot read property 'value' of undefined from

279 | this.update(oldData);

in src/core/component.js

I see you are using the Aframe asset manager which I am not, but I tried adding the asset to the THREE.Cache before using it here and that made no difference.

Any idea if it can be used in this way?