Come passare un valore dai dati Vue a href?

142

Sto cercando di fare qualcosa del genere:

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

Non riesco a capire come aggiungere il valore di r.idalla fine hrefdell'attributo in modo da poter effettuare una chiamata API. Eventuali suggerimenti?

vue.js vue-router

— bbennett36
fonte

Risposte:

320

Devi usare v-bind:o il suo alias :. Per esempio,

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

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

— asemahle
fonte

Sto ottenendo un errore di compilazione con entrambi anche se dovrebbe funzionare. Forse ha un problema dato che è all'interno di una v-for?

— bbennett36,

Aveva bisogno di un "+". Funzionava <a :href="'/job/' + r.id"> {{r.job_title}} </a>

— bbennett36,

Oppure puoi farlo con il modello ES6 letterale:

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

— Ardhi
fonte

Se vuoi visualizzare i link provenienti dal tuo stato o dal tuo negozio in Vue 2.0, puoi fare così:

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

— Waqar Shahid
fonte

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.

Licensed under cc by-sa 3.0 with attribution required.