Jak przekazać wartość z danych Vue do href?

Question

Próbuje zrobić coś takiego

<div v-for="r in rentals"> 
       <div> 
        <a bind-href="'/job/'r.id"> {{ r.job_title }} </a> 
        <br /> 
        <p><strong></strong> - {{ r.location }} 
         <p>{{ r.shortDesc }} </p> 
         <p>{{ r.location }} </p> 
       </div> 
       <hr> 

      </div> 

nie mogę dowiedzieć się, jak przekazać wartość od r.id do końca href rozmowy, więc mogę dokonać wywołania API. Jakieś sugestie?

Answer 1

Należy użyć v-bind: lub jego aliasu :. Na przykład,

<a v-bind:href="'/job/'+ r.id"> 

lub

<a :href="'/job/' + r.id"> 

Answer 2

Albo można zrobić z ES6 szablonu dosłownym:

<a :href="`/job/${r.id}`"