programing

vuex 지속 상태가 전체적으로 변환으로 업데이트되지 않음

goodcopy 2022. 8. 28. 18:49
반응형

vuex 지속 상태가 전체적으로 변환으로 업데이트되지 않음

조작하고 싶은 vuex 상태가 지속되고 있습니다.이 상태는 브라우저 새로고침 시에도 지속되지만 코드를 표시하고 싶을 때는 언제든지 코드를 사용하여 클리어하고 있습니다.

store.displaces를 설정합니다.

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'
//importing modules
import modules from './modules'

const persistState = createPersistedState({
  paths: ['firebase','user'],
})

Vue.use(Vuex)

export default new Vuex.Store({
  modules: {
    ...modules,
  },
  plugins: [persistState],
})

모듈/index.displaces

/** this script will go through your modules and then i will generate an object
 * of each module that will export from store.js
 * */

    import camelCase from 'lodash.camelcase'
    const requireModule = require.context('.', true, /\.js$/)
    const modules = {}
    
    requireModule.keys().forEach((fileName) => {
      if (fileName.match('index.js')) {
        return
      }
    
      const nameSplit = fileName.replace(/(\.\/|\.js)/g, '').split('/')
    
      const [name, sub] = nameSplit
    
      const moduleName = camelCase(name)
    
      const actualFragment = requireModule(fileName)
    
      modules[moduleName] = modules[moduleName] || {}
      modules[moduleName][sub] = actualFragment.default || actualFragment
    })
    
    export default modules

모듈/사용자/actions.module

import router from "@/router/router";
import Request from "@/mixins/BackendRequest";

import {
  USER_REQUEST_START,
  SET_USER,
  USER_REQUEST_ERROR,
  SET_USER_SESSION,
  SET_USER_DATA,
} from "./mutation-types";
import firebase from "firebase/app";
import Vue from "vue";

const actions = {
  setUserData({ commit }, data) {
    commit(SET_USER_DATA, data);
  },
};

export default actions;

모듈/사용자/getters.modules

 const getters = {
      user(state) {
        return state
      },
export default getters

모듈/사용자/상태js

const state = {
  loading: false,
  error: null,
  data: {},
  sessionTimeOut: null,
  loggedIn: false,
}

export default state

module/user/module.disc.displays

import defaultState from './state'

const mutations = {
  SET_USER_DATA(state, data) {
    if (data === null) {
      state = defaultState
    }
    state = {...state, data}
    console.log(state);
  },
}

export default mutations

내 돌연변이를 이렇게 부르는 거야

 this.$store.dispatch('setUserData', null)

상기의 돌연변이SET_USER_DATA/setUserDataconsole.log()는 예상대로 갱신된 상태를 나타내지만 글로벌하게 갱신/반영하지 않습니다.

언급URL : https://stackoverflow.com/questions/66277922/vuex-persisted-state-not-updating-with-mutation-globally

반응형