Vue.js 计算属性';名称';已分配,但没有设置器(无v型)

Vue.js 计算属性';名称';已分配,但没有设置器(无v型),vue.js,vuejs2,vue-component,vuex,Vue.js,Vuejs2,Vue Component,Vuex,我试图通过添加所选的类nav使导航在单击时处于活动状态。我见过其他类似的问题,但它们与v-model有关,因此它们没有帮助我 我需要确保它已添加到存储中,以便即使在刷新后也能始终看到哪个页面处于活动状态。但是,我收到以下错误: Navigation.vue: <template> <v-container> <v-layout align-center> <!-- Logo -->

我试图通过添加所选的类
nav
使导航在单击时处于活动状态。我见过其他类似的问题,但它们与
v-model
有关,因此它们没有帮助我

我需要确保它已添加到存储中,以便即使在刷新后也能始终看到哪个页面处于活动状态。但是,我收到以下错误:

Navigation.vue:

    <template>
    <v-container>
        <v-layout align-center>
            <!-- Logo -->
            <v-flex sm2>
                <img src="http://beam.space/img/icon.png" height="30px">
            </v-flex>
            <!-- Navigation -->
            <v-flex sm8>
                <v-layout wrap justify-center>
                    <v-flex sm2>
                        <router-link to="/myspaces">
                            <h2 @click="setActiveNav(0)" :class="{'nav-selected': activeNavigation === 0}" class="nav-text">My Spaces</h2>
                        </router-link>

                    </v-flex>

                    <v-flex sm2>
                        <router-link to="/inspirations">
                            <h2 @click="setActiveNav(1)" :class="{'nav-selected': activeNavigation === 1}" class="nav-text">Inspirations</h2>
                        </router-link>
                    </v-flex>
                </v-layout>
            </v-flex>
            <v-flex sm2>
                <p>profile</p>
            </v-flex>
        </v-layout>
    </v-container>
</template>

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

    export default {
        name: "navigation",
        computed: {
            ...mapState([
                'activeNavigation'
            ])
        },
        methods: {
            setActiveNav(activeNav) {
                this.activeNavigation = activeNav;
                this.store.commit('setActiveNavigation', this.activeNavigation);
            }
        }
    }
</script>

<style scoped>

</style>
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex);

export default new Vuex.Store({
    state: {
        activeNavigation: 0
    },
getters: {

    },
    mutations: {
        // Set Active navigation on click.
        setActiveNavigation(state, id) {
            state.activeNavigation = id;
        }

    },

    // actions zijn a sync
    actions: {
    }
});

mapState
仅创建getter属性。您不能指定给这些属性

无需分配给
activeNavigation
无论如何,提交将自动更新
activeNavigation
的映射值

更改此项:

setActiveNav(activeNav){

this.activeNavigation=activeNav;//这是有道理的!但是现在我得到了以下错误:
uncaughttypeerror:无法读取未定义的属性“commit”
activeNav
不是未定义的,那么什么是?
store
应该是
$store
。这很好,但是..当我重新加载页面时,它对我来说似乎不是morise activeNavigation。它会重新加载,并且会重置
activeNavigation
。我是否对该存储的工作方式感到困惑?Vuex状态不会在页面重新加载时持续存在。这是一个非常复杂的问题,但这是一个完全其他的问题,我将在这里不再详细讨论。