Question

很抱歉，我承认gleaning from SAVuegram正在为我的应用设置身份验证。我正在运行Firebase的onAuthStateChanged，以确保用户在页面刷新期间保持登录状态，但是我完全无法访问函数内部的状态，并收到以下错误。

（$ store来自我，是在测试“ $ store”和“ store”时截屏的-都坏了。）

开启严格的调试功能后，我还会收到警告我有关在变异处理程序之外进行变异的消息，但这不是我在做什么吗？

这是我的store / index.js

import Vue from 'vue'
import Vuex from 'vuex'
import fb from '../components/firebase/firebaseInit'
import createLogger from 'vuex/dist/logger'

// import dataRefs from './dataRefs'
// import pageTitle from './modules/pageTitle'
import auth from './modules/auth'
import apps from './modules/applicants'

Vue.use(Vuex)

fb.auth.onAuthStateChanged(user => {
    if (user) {
      // here I can access the user object but never the following "store"
      console.log("FB AUTH", user);
      store.commit('setCurrentUser', user)
      store.dispatch('fetchUserProfile')
    }
});

const debug = process.env.NODE_ENV !== 'production'

const createStore = () => {
  return new Vuex.Store({

    state: {
        pageTitle: '',
        currentUser: null,
        userProfile: null
      },

    mutations: {

      changePageTitle(state, newTitle) {
        state.pageTitle = newTitle
      },

      changeSnackBarMessage(state, newMessage) {
        state.snackBarMessage = newMessage
      },

      // POPUPS
      changeAdvisorAddAppPopupStatus(state) {
        state.showAdvisorAddPopup = !state.showAdvisorAddPopup
      },

      setToken(state, token) {
        state.token = token;
      },

      setUser(state, userObj) {
        state.user.email = userObj.email;
        state.user.fbUUID = userObj.uuid;
      }
    },

  actions: {
      updatePageTitle(vuexContext, newTitle) {
        vuexContext.commit('changePageTitle', newTitle);
      },
      updateSnackBarMessage(vuexContext, newMessage) {
        vuexContext.commit('changeSnackBarMessage', newMessage);
      },
      toggleAdvisorAddPopup(vuexContext) {
        vuexContext.changeAdvisorAddAppPopupStatus
      },
  },

    modules: {
    auth,
    apps
    },
    strict: debug,
    plugins: debug ? [createLogger()] : []
  })
};
export default createStore;

仅供参考，我还尝试通过使用export const store = new Vuex.Store({而不是const create ...方法来实例化商店，但随后Vuex向我展示了我的状态，操作，获取器或变异都找不到。

感谢您的帮助。

Answer 1

为什么要在函数中创建商店？

const createStore = () => {

我只是那样做：

const store = new Vuex.Store({
    state: {},

    mutations: {},

    actions: {},

    modules: {
       auth,
       apps
    },
    strict: debug,
    plugins: debug ? [createLogger()] : []
  })
};

export default store;

我现在可以访问商店。

从store / index.js内部访问vuex突变时出现问题

1 个答案: