如何在Laravel中将Vue.js变量传递给url标记 [英] How to pass a vuejs varaible to a url tag in laravel

问题描述

我在vuejs中确实有一个变量:

I do have a variable in vuejs :

invoice.id 

我想将此ID添加到刀片的laravel路由中，如下所示:

I want to add this id to a laravel route in blade like so :

<a href="/invoice/{{invoice.id}}/history" />

但是它不起作用，有什么方法可以将该变量传递给路线吗?

but it does not work, is there any way how to pass that variable to the route ?

我正在以类似数组的形式获取发票:

I am getting invoices as an array like so :

<script>
    import {statusColor} from "../util";

    export default {
        props: ['invoice', 'index'],
</script>

为其数组开票.

推荐答案

在vuejs中将href绑定为:href或v-bind:href

Bind href in vuejs as :href or v-bind:href

<a :href="'/invoice/'+invoice.id+'/history'" />

检查以下示例

var V = new Vue({
  el:"#app",
  data:{
    invoice:{id:111}
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.8/vue.js"></script>
<div id="app">
<a :title="'/invoice/'+invoice.id+'/history'" :href="'/invoice/'+invoice.id+'/history'">Hover me to check href value</a>
</div>

以下是由props

var Child = {
  template:`<div>Child component : <a :title="'/invoice/'+invoice.id+'/history'" :href="'/invoice/'+invoice.id+'/history'">Hover me to check href value</a></div>`,
  props:['invoice'],
}
var V = new Vue({
  el:"#app",
  data:{
    invoice:{id:111}
  },
  components:{
    Child
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.8/vue.js"></script>
<div id="app">

<child :invoice="invoice"></child>
</div>

这篇关于如何在Laravel中将Vue.js变量传递给url标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！