小编Chr*_*oln的帖子

我正在尝试按本文所示访问Vuex存储：这里

我浪费了一个早上好，因为我确定这将是一个简单的错字，但是它使我无所适从。在beforeEach（）=> {}主体内部，我得到“未定义存储”。

我正在使用LoginForm组件中的商店，它似乎在那里。chrome调试器中的Vuex选项卡显示了我期望的商店内容。我做错了什么？

从关键代码中剪切粘贴：

src /路由器/index.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import LoginForm from '@/components/LoginForm'
import HomePage from '@/components/HomePage'
import store from '@/store'

Vue.use(VueRouter)

const router = new VueRouter({
    routes: [
        {
            path: '/login',
            component: LoginForm
        },
        {
            path: '/home',
            component: HomePage,
            meta: {requiresAuth: true}
        }
    ]
})

router.beforeEach((to, from, next) => {
    // store is undefined here
    const IsAuthenticated = store.getters.IsAuthenticated()
    if (to.matched.some(record => record.meta.requiresAuth) && !IsAuthenticated) {
        next({path: '/login', query: { redirect: to.fullPath …

redux指南指出:

我们不会改变国家.我们使用Object.assign()创建一个副本.Object.assign(state,{visibilityFilter:action.filter})也是错误的:它会改变第一个参数.您必须提供一个空对象作为第一个参数.您还可以启用对象扩展运算符提议来编写{... state,... newState}.

我碰巧写了下面的代码片段:

[actions.setSelection](state, {payload}) {
    state[payload.key] = payload.value;
    return state;
},

我对此感到不满,并重新审视了智慧指南.我已经重写了这个:

[actions.setSelection](state, {payload}) {
    const result = Object.assign({}, state);
    result[payload.key] = payload.value;
    return result;
},

我很确定我在我的代码的其他地方冒犯了上面提到的诫命.如果我没有勤奋地跟踪他们,我会看到什么样的后果？

(注意:上面的reducer语法是通过redux-actions.否则它将是reducer fn switch/case中的代码块.)