vue.js / Vue getter not defined error

Question

I get an error with my App.vue component , getter: logged

<li id="shoppinglists" v-if="!logged">...

ERROR LOG: '[Vue warn]: Property or method "logged" is not defined on the instance but referenced during render. 
Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.

I don't understand why it's stated as non-defined, as I don't get error with another defined getter: currentUserId

<li v-else id="shoppinglists"><router-link :to="{ name: 'ShoppingLists', params: { id: currentUserId } }" >Shopping Lists</router-link></li>

Bothe are defined as computed props :

<script>
import store from '@/vuex/store'
import { mapGetters } from 'vuex'

export default {
  name: 'app',
  computed: {
    ...mapGetters([
      { currentUserId: 'getCurrentUserId' },
      { logged: 'getCurrentUserStatus' }
    ])
  },
  store
}
</script>

and my vex/getters.js is :

vuex/getters.js

export default {
  getCurrentUserStatus: state => state.logged,
  getCurrentUserId: state => state.currentUserId,
  ...
}

and my store is

vuex/store.js

import Vue from 'vue'
import Vuex from 'vuex'
import getters from './getters'
...

Vue.use(Vuex)

const state = {
  logged: false,
  currentUserId: '',
  ...
}

export default new Vuex.Store({
  state,
  getters,
   ...
})

Vamsi Krishna · Accepted Answer · 2017-10-23 08:30:34Z

1

Just pass an object to ...mapGetters if you want to use the getters with different name

So the syntax is:

...mapGetters({
      currentUserId: 'getCurrentUserId',
      logged: 'getCurrentUserStatus' 
 })

edited Oct 23, 2017 at 8:30

answered Oct 23, 2017 at 8:22

Vamsi Krishna

31.4k8 gold badges73 silver badges81 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user762579 Over a year ago

thanks a lot .. I did not get it right in writing it... I thought it was an array of objects... now I an see the vex binding in my Vue tool... !

Collectives™ on Stack Overflow

vue.js / Vue getter not defined error

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related