programing

Vuex createPersistedState 부분 지속이 작동하지 않음

prostudy 2022. 5. 5. 10:19
반응형

Vuex createPersistedState 부분 지속이 작동하지 않음

지속적 국가 문서(https://www.npmjs.com/package/vuex-persistedstate),에 따라 다음과 같이 부분적으로 상태를 유지하려고 한다.

export default new Vuex.Store({
  state: {
    user: {},
    signupLayout: false,
    adminLayout: false,
    sidebarOpen: false,
    homeLayout: false, /* New - 6/01/2021 */
    cloudinary: {
      cloud_name: "*****",
      base_upload_preset: "*****",
      channel_header_upload_preset: "*****",
      profile_image_upload_preset: "*****",
      audio_upload_preset: "*****",
      cover_image_upload_preset: "*****",
    },
    plugins: [createPersistedState({
      paths: ["user", "signupLayout", "adminLayout", "sidebarOpen", "homeLayout"]
    })],
  },
  mutations: {
    setUser(state, user) {
      state.user = user;
    },
    setSignupLayout(state, bool) {
      state.signupLayout = bool;
    },
    setSidebarOpen(state, bool) {
      state.sidebarOpen = bool;
    },
    setAdminLayout(state, bool) {
      state.adminLayout = bool;
    },

    /* New - 6/01/2021 */
    setHomeLayout(state, bool) {
      state.homeLayout = bool;
    },
  },

하지만 내가 코드를 실행하려고 할 때, 어떤 것도 지속되지 않는다.왜, 어떻게 고쳐야 하는지 말해줄 사람?

플러그인 속성의 위치가 잘못됨.이렇게 해야죠.

import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'
    
export default new Vuex.Store({
  state: {},
  mutations: {},
  actions: {},
  modules: {},
  plugins: [createPersistedState()],
})

vuex-persistedstate플러그인은 아무것도 바뀌지 않았기 때문에 기본 상태를 저장할 필요가 없다고 생각할 수 있다.그리고 난 너의 vuex 상점에 어떤 돌연변이도 보이지 않아.지속 상태 플러그인은 상태 돌연변이에 대해 작동하므로 돌연변이(vuex 문서 돌연변이 페이지)로 상태를 수정하고 플러그인이 작동하기 시작해야 한다.

지금은 답이 아주 쉬운 시기의 하나이다.알고 보니 플러그 인 속성이 상태 속성 개체 안에 있었네.방금 국유 재산 밖으로 옮겼는데, 이제 모든 것이 의도대로 작동한다.

export default new Vuex.Store({
  state: {
    user: {},
    signupLayout: false,
    adminLayout: false,
    sidebarOpen: false,
    homeLayout: false, /* New - 6/01/2021 */
    cloudinary: {
      cloud_name: "*****",
      base_upload_preset: "*****",
      channel_header_upload_preset: "*****",
      profile_image_upload_preset: "*****",
      audio_upload_preset: "*****",
      cover_image_upload_preset: "*****",
    },
  },
  plugins: [createPersistedState({
    paths: ['user', 'signupLayout', 'adminLayout', 'sidebarOpen', 'homeLayout']
  })],
  mutations: {
    setUser(state, user) {
      state.user = user;
    },
    setSignupLayout(state, bool) {
      state.signupLayout = bool;
    },
    setSidebarOpen(state, bool) {
      state.sidebarOpen = bool;
    },
    setAdminLayout(state, bool) {
      state.adminLayout = bool;
    },

    /* New - 6/01/2021 */
    setHomeLayout(state, bool) {
      state.homeLayout = bool;
    },
  },
});

참조URL: https://stackoverflow.com/questions/68087950/vuex-createpersistedstate-partial-persist-not-working

반응형