In this lesson, we will show the user's name and email and will build the Log out
button.
Composable Method
First, in the auth Composable, let's add a reactive user
object.
resources/composables/auth.js:
import { ref, reactive } from 'vue'import { useRouter } from "vue-router"; const user = reactive({ name: '', email: '',}) // ...
Then, after successful login, we need to assign the values to that object.
resources/composables/auth.js:
import { ref, reactive, inject } from 'vue'import { useRouter } from 'vue-router'; const user = reactive({ name: '', email: '',}) export default function useAuth() { // ... const loginUser = (response) => { user.name = response.data.name user.email = response.data.email localStorage.setItem('loggedIn', JSON.stringify(true)) router.push({ name: 'posts.index' }) } // ... return { loginForm, validationErrors, processing, submitLogin } return { loginForm, validationErrors, processing, submitLogin, user } }
Now, let's build a method to use...