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状态不会在页面重新加载时持续存在。这是一个非常复杂的问题,但这是一个完全其他的问题,我将在这里不再详细讨论。