Wie übergebe ich einen Wert aus Vue-Daten an href?

141

Ich versuche so etwas zu tun:

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

Ich kann nicht herausfinden, wie der Wert von r.idam Ende des hrefAttributs hinzugefügt werden soll, damit ich einen API-Aufruf durchführen kann. Irgendwelche Vorschläge?

vue.js vue-router

— bbennett36
quelle

Antworten:

318

Sie müssen v-bind:oder seinen Alias verwenden :. Beispielsweise,

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

oder

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

— asemahle
quelle

Ich bekomme einen Kompilierungsfehler mit beiden, obwohl es funktionieren sollte. Vielleicht hat es ein Problem, da es sich in einem V-For befindet?

— Bbennett36

Es brauchte ein "+". Dies funktionierte <a :href="'/job/' + r.id"> {{r.job_title}} </a>

— bbennett36

Oder Sie können dies mit dem ES6-Vorlagenliteral tun:

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

— Ardhi
quelle

Wenn Sie Links anzeigen möchten, die aus Ihrem Bundesstaat oder Geschäft in Vue 2.0 stammen, haben Sie folgende Möglichkeiten:

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

— Waqar Shahid
quelle

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.

Licensed under cc by-sa 3.0 with attribution required.