Laravel 5.3 und Vue 2

Question

Ich spiele mit Vue 2 in einer neuen Laravel 5.3 App, und ich bin mir nicht sicher, wie man eine URL im Laravel-Format bindet.

Ich habe einige Config-Zeilen aus einem DB gezogen, und ich möchte einfach über sie mit der Anzeige der Daten, und dann eine Schaltfläche präsentieren, um Sie zu einem Bearbeitungsbildschirm zu bringen. Vue nicht einfach unterstützen die Config-Zeile die ID in der URL interpoliert, wie ich über die Zeilen bin Looping mit:

<tr v-for="config in data"> 
    <td> 
    <a href="/configurations/{{ config.id }}/edit">{{ config.name }}</a> 
    </td> 
</tr> 

Die Vue docs auf eine andere Funktion wie diese zu binden, sagen:

<a v-bind:href="url"> 

und dann habe ich eine URL Methode wie folgt definiert:

export default { 
    mounted() { 
     console.log('Component ready.') 
    }, 
    data: function() { 
     return { 
      data: [config data array] 
     } 
    }, 
    computed: { 
     url: function() { 
      console.dir(this); // the whole component, not the row 
      console.dir(this.id); // undefined 
      console.dir(this.config); // undefined 
      return "/configurations/" + this.config.id + "/edit" // throws error 
     } 
    } 
} 

ich kann die zurückgegebene URL zu bekommen scheinen zu machen, ist es normalerweise wirft entweder einen Fehler oder beschwert sich, dass meine var nicht definiert ist.

Wie beende ich diese (einfache) Aufgabe?

Answer 1

Die Lösung war, die berechnete URL-Funktion zu ignorieren und einfach folgendes zu tun: <a :href="'/configurations/' + config.id + '/edit'">