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.