lo siento si soy nuevo en vue y me fastidio. Estoy tratando de representar un img con un src que proviene de una propiedad de objeto que proviene de una matriz que devuelvo de data()

No recibo ningún error, pero no veo que aparezca ningún ícono, estoy usando otras imágenes del mismo directorio sin problemas, así que asumo que mi sintaxis es incorrecta. He validado que img src es correcto. No lo hago. No veo una forma diferente de hacer esto buscando en Google, así que espero que alguien tenga alguna idea para mí :)

Descubrí que recibo un error si uso

 v-bind:src="getImage(imagePath)"

Si hago esto, parece que vue busca el archivo pero devuelve un error en la consola que no puede encontrar el elemento, usé el archivo en otro lugar fuera del ciclo for y funcionó bien:/

mi consola también muestra el img src correctamente en el código fuente en render

modelo

 <!-- active agencies --> <b-tab title="Active" active><b-card-text> <ul class="pendingAgencyList"> <li v-for="agent in pendingAgency" :key="agent.Status"> <div v-if="agent.Status == 'active'" class="pendingAgencyItem"> <img :src="agent.Icon" :key="agent.Status" height="30px" width="30px"/> //ADDING IMAGE HERE <small>Name</small> <p>{{ agent.Name }}</p> </div> <div v-if="agent.Status == 'active'" class="pendingAgencyItem"> <small>Contact</small> <p>{{agent.Contact}}</p> </div> <p v-if="agent.Status == 'active'" >{{agent.Status}}</p> </li> </ul> </b-card-text></b-tab>

como referencia aquí hay una muestra de mis datos

 data() { return { pendingAgency:[ { Icon: '../assets/agency_logo-2.png', Name: "Moony Fox", Contact: "345-235-7685", Status: "pending" }, { Icon: '../assets/agency_logo-5.png', Name: "Bofy Fox", Contact: "345-235-7685", Status: "Rejected" }, { Icon: '../assets/agency_logo-3.png', Name: "Felony Mo", Contact: "345-235-7685", Status: "red" } ] } }