如何将值从Vue数据传递到href？

Question

我正在尝试做这样的事情:

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

我无法弄清楚如何将值添加r.id到href属性的末尾,以便我可以进行API调用.有什么建议？

Answer 1

您需要使用v-bind:或其别名:.例如,

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

要么

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

Answer 2

或者你可以用ES6模板文字做到这一点:

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

Answer 3

您可以在绑定时将静态值和动态值连接为字符串值href。使用你的例子：

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