[Vuejs]-Logged user object is all string

by

1👍

✅

To extract just the user name from the JSON string you’ve stored in the meta tag in your Laravel view and pass it to your Vue.js component, you can follow these steps:

  1. In your Laravel app.blade.php, pass only the user name as a separate meta tag:
<meta name="user_name" content="{{ Auth::user()->name }}">
  1. In your Vue.js index.vue component, extract the user name from the meta tag:
<template>
  <div>
    {{ loggedUserName }}
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';

const loggedUserName = ref('');

onMounted(() => {
  const metaTag = document.querySelector("meta[name='user_name']");
  if (metaTag) {
    loggedUserName.value = metaTag.getAttribute('content');
  }
});
</script>

With these changes, you are passing only the user name from Laravel to Vue.js, and in your Vue component, you extract and display just the user name.

👤Aliif

Leave a comment