将数据从 blade 传递到 vue 组件

Question

我正在尝试学习 vue，因此我也想将它与 laravel 集成。我只是想将用户 ID 从 blade 发送到 vue 组件，这样我就可以在那里执行放置请求。假设我在刀片中有这个：

 <example></example>

如何将 Auth::user()->id 发送到此组件并使用它。

我一直在寻找这个，但找不到可以说明这一点的答案。

谢谢！

原文由 Ovidiu G 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

要将数据传递给您的组件，您可以使用 props 。在 此处 查找有关道具的更多信息。 这 也是定义这些道具的一个很好的来源。

你可以这样做：

 <example :userId="{{ Auth::user()->id }}"></example>

或者

<example v-bind:userId="{{ Auth::user()->id }}"></example>

然后在你的 Example.vue 文件中你必须定义你的道具。然后你可以通过 this.userId 访问它。

喜欢 ：

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

原文由 Giesburts 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

如果你通过 Laravel 提供文件

然后这是您可以应用的技巧。

在你的 app.blade.php

 @if(auth()->check())
<script>
    window.User = {!! auth()->user()  !!}
</script>
@endif

现在您可以访问 User 全局可用的对象

希望这可以帮助。

原文由 PULL STACK DEV 发布，翻译遵循 CC BY-SA 3.0 许可协议