CODEWITHSUNDEEP
javascriptlaravelvue.js
Geoff_S
Geoff_S

Reputation: 5107

auth email in laravel template and vue component for display and data passing

I'm trying to figure out how I can access my logged in users email address in a way that I can display it in my template but also have it accessible in an axios call upon a form submission.

I'm using vue with laravel 5.8 and trying to do this with the blade and component

blade

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

test.vue

<template>
<div>

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

... 


props: [
    email: ''
]

How can I properly store the email to both be displayed and passed in axios?

Upvotes: 0

Views: 291

Answers (1)

Ben
Ben

Reputation: 2235

If you are passing Auth::user()->email through the prop, like this:email="{{ Auth::user()->email }}" - you are able to use this.email in your vue component to access it, and send it through axios simple as this: 

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

Also, if you want to have your auth user always available in your vue component you can do it by assigning it to window.user variable like this:

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

Then in your vue component you can do something like this window.user.email and such.

Also, I encourage you to take a look at this article - it will give you some more examples.

Hope this helps.

Upvotes: 1

Related Questions