Как передать значение из данных Vue в href?

Я пытаюсь сделать что-то вроде этого:

<div v-for="r in rentals">
  <a bind-href="'/job/'r.id"> {{ r.job_title }} </a>
</div>

Я не могу понять, как добавить значение r.id в конец атрибута href чтобы я мог сделать вызов API. Какие-либо предложения?

Ответы

Вам нужно использовать v-bind: или его псевдоним :. Например,

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

или

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

Или вы можете сделать это с литералом шаблона ES6:

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

Если вы хотите отображать ссылки из вашего штата или магазина в Vue 2.0, вы можете сделать это следующим образом:

<a v-bind:href="''"> {{ url_link }} </a>