Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
class Svg {
constructor(name) {
let div = document.createElement('div');
div.innerHTML = require('../../../../public/img/svg/' + name + '.svg'); // change to wherever your svg files are
let fragment = document.createDocumentFragment();
fragment.appendChild(div);
this.svg = fragment.querySelector('svg');
}
classes(classes) {
if (classes) {
this.svg.classList = '';
classes.split(' ').forEach(className => {
this.svg.classList.add(className);
});
}
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: {
classList: 'flex items-center',
innerHTML: new Svg(this.name)
.classes(this.classes)
.width(this.width)
.height(this.height)
}
});
}
};
@randy-allen

This comment has been minimized.

Copy link
Owner Author

randy-allen commented Aug 1, 2019

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.