Skip to content

Instantly share code, notes, and snippets.

@JeffreyWay JeffreyWay/InlineSvg.js Secret
Created Jul 11, 2019

Embed
What would you like to do?
class Svg {
constructor(name) {
let div = document.createElement('div');
div.innerHTML = require('../images/badges/' + name); // be careful with dynamic webpack requires.
let fragment = document.createDocumentFragment();
fragment.appendChild(div);
this.svg = fragment.querySelector('svg');
}
classes(classes) {
if (classes) {
this.svg.classList.add(classes);
}
return this;
}
width(width) {
if (width) {
this.svg.setAttribute('width', width);
}
return this;
}
height(height) {
if (height) {
this.svg.setAttribute('height', height);
}
return this;
}
toString() {
return this.svg.outerHTML;
}
}
export default {
props: ['name', 'classes', 'width', 'height'],
render(h) {
return h('div', {
domProps: {
innerHTML: new Svg(this.name)
.classes(this.classes)
.width(this.width)
.height(this.height)
}
});
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.