javascript - Laravel 模板和 vue 组件中的身份验证电子邮件用于显示和数据传递

Question

我正在尝试弄清楚如何访问我登录的用户的电子邮件地址，以便我可以在模板中显示它，同时也可以在提交表单时通过 axios 调用来访问它。

我正在将 vue 与 laravel 5.8 一起使用，并尝试使用 Blade 和组件来执行此操作

Blade

<test-component :email="{{ Auth::user()->email }}"></test-component>

测试.vue

<template>
<div>

    <div>
        Creator - <span> {{ email }} </span>
    </div>
</div>
</template>

... 


props: [
    email: ''
]

如何正确存储电子邮件以在 axios 中显示和传递？

Answer 1

如果您通过 prop 传递 Auth::user()->email，如下所示:email="{{ Auth::user()->email }}" - 您可以在 vue 组件中使用 this.email 来访问它，并通过 axios 发送它，就像这样简单:

axios.post('/user', {
    email: this.email,
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

此外，如果您希望 auth 用户始终在 vue 组件中可用，您可以通过将其分配给 window.user 来实现> 像这样的变量:

<script> window.user = {{ Auth::user() }}</script>

然后在您的 vue 组件中，您可以执行类似 window.user.email 之类的操作。

此外，我鼓励您查看 this article - 它会给你更多的例子。

希望这有帮助。