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

vue.js href

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

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

我不知道如何将 r.id 的值添加到 href 属性的末尾，以便进行 API 调用。有什么建议么？

Saurabh

您需要使用 v-bind: 或其别名 :。例如，

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

或者

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

我得到了一个编译错误，即使它应该工作。也许它有问题，因为它在 v-for 内？

它需要一个“+”。这有效 {{ r.job_title }}

4年后我遇到了同样的问题，这个答案再次为我解决了这个问题。谢谢！

Ardhi

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

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

Penny Liu

如果您想显示来自您所在州的链接或存储在 Vue 2.0 中，您可以这样做：

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

fcva

这也可以提供帮助。

<a target="_blank" :href="r.reg_metadato">{{ r.reg_metadato }}</a>

Khalid Ibrahim

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

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