[Vuejs]-How to pass logged user from control to vuejs component?

3๐Ÿ‘

โœ…

You should follow these steps to pass auth user in vue component.

You should add a <meta name="user" content="{{ Auth::user() }}"> in

// app.blade.php or whatever you have maybe master.blade.php like below

<head>
    <meta charset="UTF-8">
    @if (Auth::check()) 
      <meta name="user" content="{{ Auth::user() }}">
    @endif 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" 
  ...
  ...

and then in your component inside data object do this action:

 data() {
        return {
            
            loggedUser : document.querySelector("meta[name='user']").getAttribute('content')
        }
    },

and you should see the logged in user in component mounted method:

 mounted() {
        console.log(this.loggedUser);
    },

and now you can use the user object in every where of your component.

0๐Ÿ‘

You can also get logged in information with this example:

lets say app.blade.php its your file that loads your page.
You can set a script that stores your authentication.

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

Then in your vue component or even better if you are using vuex store you can get the object.

data(){
  loggedUser: window.user
}
๐Ÿ‘คEdmon Belchev

Leave a comment