programing

계산된 속성 'name'이(가) 할당되었지만 설정자가 없습니다(v-model 없음).

procenter 2022. 8. 28. 23:02
반응형

계산된 속성 'name'이(가) 할당되었지만 설정자가 없습니다(v-model 없음).

클래스를 추가하여 클릭할 때 네비게이션을 활성화하려고 합니다.nav-selected이런 질문들을 많이 봤지만 이런 질문들은v-model그래서 도움이 안 됐어요.

리프레시 후에도 활성화 되어 있는 페이지를 항상 볼 수 있도록 스토어에 추가해야 합니다.다만, 다음의 에러가 표시됩니다.

에러

내비게이션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>

Store.js:

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;  // <-- Not allowed
    this.store.commit('setActiveNavigation', this.activeNavigation);
}

다음과 같이 입력합니다.

setActiveNav(activeNav) {
    this.$store.commit('setActiveNavigation', activeNav);
}

언급URL : https://stackoverflow.com/questions/51208211/computed-property-name-was-assigned-but-it-has-not-setter-without-v-model

반응형