vue.js / Vue getter 未定义错误

Posted 2023-02-23

【中文标题】vue.js / Vue getter 未定义错误

【英文标题】：vue.js / Vue getter not defined error

【发布时间】：2018-04-03 17:06:09

【问题描述】：

我的 App.vue 组件出现错误，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. 

我不明白为什么它被声明为未定义，因为我没有收到另一个定义的 getter 错误：currentUserId

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

两者都被定义为计算道具：

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

export default 
  name: 'app',
  computed: 
    ...mapGetters([
       currentUserId: 'getCurrentUserId' ,
       logged: 'getCurrentUserStatus' 
    ])
  ,
  store

</script>

而我的 vex/getters.js 是：

vuex/getters.js

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

我的商店是

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,
   ...
)

【参考方案1】：

如果您想使用不同名称的 getter，只需将对象传递给 ...mapGetters

所以语法是：

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

【讨论】：

非常感谢..我写得不对...我以为它是一个对象数组...现在我在我的 Vue 工具中看到了 vex 绑定... !