icon.vue

<template>
    <svg class="bgln__icon" :viewBox="svg.viewBox">
        <slot></slot>
        <use :xlink:href="location + '#' + svg.id" />
    </svg>
</template>
<script>
export default {
  name: 'icon',
  data() {
    return {
        svg: {
            content: '',
            id: '',
            viewBox: '',
        },
        location: ''
    };
  },
  props: {
      name: {
          type: String,
          required: true
      },
  },
  serverCacheKey: props => props.name,
  created () {
      if(this.name === "" || this.name === undefined) {
        APP.log.error('Undefined icon name')
      } else {
        let icon = require('@root/assets/svg/'+this.name+'.svg');
        this.svg = icon.default;
      }
  },
  mounted() {
      this.location = location.origin + location.pathname + location.search;
  }
}
</script>