diff --git a/src/components/NavigationBar.vue b/src/components/NavigationBar.vue index 82ad0ae95ac609ec65fd0581effd7685ba5cd429..2b21cf2c2b24a24ec409297bf470f4d443185945 100644 --- a/src/components/NavigationBar.vue +++ b/src/components/NavigationBar.vue @@ -10,11 +10,16 @@ ></v-app-bar-nav-icon> <v-toolbar-title>FITMIN</v-toolbar-title> <v-spacer></v-spacer> + <span + v-if="isLogin" + > + {{ loginUser.name }}{{ loginUser.nickname ? `(${loginUser.nickname})` : '' }} 트레이너 + </span> </v-app-bar> </template> <script> -import { mapActions } from 'vuex'; +import { mapState, mapGetters, mapActions } from 'vuex'; export default { name: 'NavigationBar', @@ -23,6 +28,15 @@ export default { navDrawer: Boolean, }, + computed: { + ...mapState([ + 'loginUser', + ]), + ...mapGetters([ + 'isLogin', + ]), + }, + methods: { ...mapActions([ 'toggleNavDrawer', diff --git a/src/store/index.js b/src/store/index.js index e1c364d7b24f6d8c8666e5c32c1ff18c348c223a..137f0c3ee19a496200929f7b1c516cb9074e4290 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -9,7 +9,7 @@ export default new Vuex.Store({ isNavDrawerVisible: true, loginUser: null, }, - computed: { + getters: { isLogin: state => (state.loginUser !== null), }, mutations: {