将可变表单刀片模板传递给vue组件答案

【问题标题】：Passing variable form blade template to vue component将可变表单刀片模板传递给vue组件
【发布时间】：2019-04-18 22:24:39
【问题描述】：

我在刀片模板中有一个表单。如果我提交表单，我想将 id 变量传递给 vue 组件。我该怎么做。请帮忙。在我的代码下方。

<table>
@foreach($zam as $z)
<tr>
    <td>{{$z->id}}</td>
    <td>{{$z->name}}</td>
    <td>{{$z->status}}</td>
    <td>{{$z->getUser->name}}</td>
    <td>
        <form method="POST" action="{{route('mod_zam')}}">
            @csrf
            <select name="status">
                <option value="przyjete"> przyjete</option>
                <option value="realizowane"> realizowane</option>
                <option value="wyslane"> wyslane</option>
            </select>
            <input type="hidden" name="id" value="{{$z->id}}" />
            <input type="submit" name="modyf" />
        </form>
    </td>
</tr>
@endforeach
</table>



 <ex id=???></ex>

我正在考虑在我的刀片中这样做：

const app = new Vue({
el: '#app',
data: {

 },
 });

但它在刀片中不起作用。我的第二个问题 - 是否可以直接在刀片中创建 vue 实例，而不是通过组件？

【问题讨论】：

标签： laravel vue.js

【解决方案1】：

您可以直接在刀片视图中制作内联模板。

<component :props="{{ $props }}" inline-template>....</component>

【讨论】：

【解决方案2】：

要将数据传递给您的组件，您可以使用props。

你可以这样做：

<component is="component" :zID="{{ $z->id }}"></component>

然后在您的Example.vue 文件中，您必须定义您的prop。然后你可以通过this.zID访问它。

<script>
  export default {
  props: ['zId'],
  mounted () {
    // Do something useful with the data in the template
    console.dir(this.zId);
    }
  }
</script>

【讨论】：

谢谢回答。我知道流行音乐。在我的刀片中，我以管理员身份循环订单。当我提交表格时，我可以更改订单状态。我不需要登录用户的 id。 $z->getUser->name 是订单所有者的名称。 $z->id 是订单的id。我的问题是当我更改订单状态时如何将所选订单的 ID 发送到前端（前组件）。
用户 ID 是您需要更改 ID 订单的一个参考
对不起，我不明白。