i have a vuex store and i'm trying to get the current logged in user information e.g ( user.name) i want this information to be displayed to the user once logged in
my vuex store
state: {
success: "",
token: localStorage.getItem("token") || "",
user: null,
},
mutations: {
AUTH_SUCCESS(state, token, email,user, name) {
state.status = "success";
state.token = token;
state.user = user;
state.user = email;
state.user = name;
},
}
how i render it in my vue component
<template>
<div class="container mt-5">
<div class="row">
<div class="col-md-12">
<div class="card border-0 shadow rounded">
<div class="card-body">
{{ isLoggedIn }}
<p>Name: {{ user }}</p>
<hr>
<button @click="logout" class="btn btn-primary btn-md">LOGOUT</button>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapState } from "vuex";
import { mapGetters } from "vuex";
export default {
data() {
return {};
},
computed: {
...mapGetters({ user: "StateUser" }),
isLoggedIn: function() {
return this.$store.getters.isLoggedIn;
},
...mapState({
user: state => state.user = {name},
})
},
methods: {
logout: function() {
this.$store.dispatch("LOGOUT").then(() => {
this.$router.push("/");
});
}
}
};
</script>
state i get in the browser name is ""
'''
success:""
token:"eyjmjhjhj"
user:[
name: ""
]