programing

경로 전환 시 Vuex 재설정 저장소 변수

batch 2023. 7. 10. 22:12
반응형

경로 전환 시 Vuex 재설정 저장소 변수

이전 경로로 돌아가서 vuex에 저장된 변수를 재설정하는 방법을 만들려고 합니다.지금까지 시도한 결과는 다음과 같습니다. (템플릿의 구성 요소에서)

<button type="button" class="btn btn-primary btn-lg btn-block" @click="bar">Back</button>

구성 요소 스크립트에서 다음을 수행합니다.

import { mapGetters } from 'vuex'

methods: {
      ...mapGetters([
        'movies'
        ]),
     bar () {
           this.$router.go(-1)
            this.movies=[]
        }
}

그리고 내 vuex 스토어:

export const store = new Vuex.Store({
    state:{
        movies : []
    },
    getters: {
        movies: state => {
            return state.movies
        }
    },
    mutations: {
        mutateArray: (state, payload) => {
            state.movies = payload
        }
    },
    actions: {
        updateArray({commit}, payload ){
            commit('mutateArray', payload)
         }
    }
})

버튼을 클릭하면 이전 경로로 이동하지만 다음 경로가 표시됩니다.movies상태 변수가 비어 있지 않습니다(해당 경로에 비어 있지 않다고 표시되는 항목이 있으므로).

문제는 당신이 잘못된 방식으로 상태를 변형시키고 있다는 것입니다.필요한 것은 빈 페이로드로 updateArray 작업을 호출하는 것입니다.막대 방법에서는 다음과 같이 보일 수 있습니다.

this.$store.dispatch('updateArray',[]);

작업을 호출하는 방법에 대한 유일한 해결책은 아닙니다.자세한 내용은 문서를 참조하십시오.

언급URL : https://stackoverflow.com/questions/58935601/vuex-reset-store-variable-when-switching-route

반응형