首页 文章

Vue mapState非反应性

提问于
浏览
1

我尝试使用mapState函数从商店获取状态,但我无法使用生成的代码将值返回到我的模板代码中...

<template>
         // Some code
                <template v-if="!isLoggedIn">
                    // Some code
                </template>
                <template v-else>
                    // Some code
                    {{ currentUser.name }} 
                </template>

        // Some code
</template>

<script>
    import { mapState } from "vuex";

    export default {
        // Some code
        computed: {
          ...mapState({auth : ['currentUser', 'isLoggedIn','customers']})
        }
    }
</script>

而是以下代码工作

<script>
    import { mapState } from "vuex";

    export default {
        // Some code
        computed: {
          currentUser() {
                return this.$store.state.auth.currentUser
            },
            isLoggedIn() {
                return this.$store.state.auth.isLoggedIn
            },
        }
    }
</script>

警告信息

[Vue warn]:属性或方法“isLoggedIn”未在实例上定义,但在渲染期间引用 . 通过初始化属性,确保此属性在数据选项或基于类的组件中是被动的 . 请参阅:https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties .

提前致谢

1 回答

  • 0

    如果您尝试从名为 auth 的命名空间的vuex模块访问值,请将模块的名称作为第一个参数传递,并将值数组作为第二个参数映射:

    computed: {
        ...mapState('auth', ['currentUser', 'isLoggedIn','customers'])
    }
    

相关问题