Tengo una matriz que estoy recorriendo en Vue y representando un elemento de anclaje con cada iteración. La matriz sobre la que estoy recorriendo es uno de mis accesorios, probé varias cosas diferentes y, aunque creo que podría hacerlo funcionar, la forma me parecería muy complicada y quiero asegurarme de que no lo sea. más simple de lo que estoy pensando
<template v-for="(lead, index) in leads"> <a target="_blank" v-bind:href="lead.present_url"><b>foobar</b></a> <div>{{lead.name}}</div> <div>{{lead.id}}</div> </template> He intentado todo tipo de combinaciones, la siguiente no es una lista exhaustiva, sino solo algunos ejemplos de lo que he probado: :href="lead.present_url" href='lead.present_url' :href='${lead.present_url}' (con tildas), varias variaciones de estos, incluso con y sin v-bind, v-bind:href='leads[index].present_url'
props: { leads: Array },Mi pregunta es: ¿cuál es la mejor manera de hacer esto?
En realidad, desea usar v-for en el elemento del que desea múltiplos, y también necesita vincular una :key :
<template> <div class="lead-container"> <div v-for="lead in leads" :key="lead.id"> <a target="_blank" :href="lead.present_url"> <strong>foobar</strong> </a> <div>{{lead.name}}</div> <div>{{lead.id}}</div> </div> </div> </template> <script> export default { props: { leads: { type: Array, default: () => [], } } } </script>