VueJS - How to bind :href within v-for
Solution 1:
you should write js code inside v-bind expression
<td>
<a v-bind:href="`mailto:${offer.BuyerEmail}`">{{offer.BuyerEmail}}</a>
</td>
<td>
<a v-bind:href="`tel:${offer.BuyerPhone}`">{{offer.BuyerPhone}}</a>
</td>
Solution 2:
You just need a computed prop to combine email
with a prefix:
<a v-bind:href="buyerEmail">{{offer.BuyerEmail}}</a>
computed: {
buyerEmail () {
return `mailto:${this.offer.BuyerEmail}`
}
}
Of course, you can do it inline but it's better to extract it to a computed prop in case this expression might become more complex.