No carga los iconos cuando entro a un enlace (vue-router)

tengo un enlace Productos que carga un componente con el mismo nombre, el punto es que cuando entre a ese enlace no me nuestra los iconos de unos botones que tengo en ese componente. Pero cuando presiona ctrl + shift + R si cargan los iconos, pero al salir a otro enlace y volver a entrar, los iconos no aparecen. 
Estoy usando vue-router para el manejos de las ruta en un proyecto de Laravel.  Alguna idea porque se comporta de esa manera. Gracias de ante mano por la ayuda.

Jorge Davila (0 xp)ago 16, 2019

Para que muchos de los iconos fuente usados hoy en día funcionen correctamente con vuejs, deben usar de usa manera "especial".

Supongamos que tienes la siguiente plantilla:

<template>
<div id="app">
 <h1>{{ message }}</h1>
 <div v-html="iconSvg"></div>
 <button @click="clicky">Click meutton>
</div>
</template>

<script>
import feather from 'feather-icons'

export default {
name: 'app',
data: function () { return { message: 'Hello, World!',   icon: 'flag' } }, 
computed: {  
     iconSvg: function () { return feather.toSvg(this.icon) } 
},
methods: { 
clicky: function () {
   this.message = 'clicked'  this.icon = 'circle'
  }  
}
}
</script>

Notemos un par de cosas aqui:

1.-Se esta importando la libreria que maneja los iconos.
2.-Esta plantilla necesita cambiar un icono al hacer click en un boton por lo que en la propiedad computada "iconSvg" esta renderizando el icono.

En este caso estamos hablando de "iconos dinamicos." en caso que tu no necesites eso,simplemente bastaria con renderizarlos al montar el componente ,y obviamente haciendo la importacion del mismo:

 mounted(){
    feather.replace() 
}

En resumen,simplemente basta con buscar la documentación de la librería de iconos que estas usando y ver como debes montarlos en vuejs para que se renderizen al montar el componente.