Изменение магазина Vuex без обновления компонента

Question

Я столкнулся с одной проблемой, когда после обновления значения моего магазина isRenewalFlow мой компонент не обновляется.

При отладке я обнаружил, что жизненный цикл компонента updated не вызывается после мутации [MUTATION_TYPES.IS_RENEWAL_FLOW] Обновляет значение хранилища. Даже getIsRenewalFlow в магазине getter вызывается только один раз в начале, а не после обновления магазина внутри мутаций.

Вот код.

Магазин

const state = {
    isRenewalFlow: undefined,
}

const getters = {
    getIsRenewalFlow: (state) => state.isRenewalFlow,
}

const actions = {
    [ACTION_TYPES.POPULATE_QUOTE_DATA]: (
        { dispatch, commit, state, rootState, getters }, payload
    ) => {
            commit(MUTATION_TYPES.IS_RENEWAL_FLOW, payload)
         }
}

const mutations = {
    [MUTATION_TYPES.IS_RENEWAL_FLOW]: (state, payload) => {
        state.isRenewalFlow = payload
    },
}

Компонент

export default Vue.extend({
    components: {
        ErrorBoundary: () => import('@/components/common/ErrorBoundary.vue'),
    },
    computed: {
        ...mapGetters({
            getIsRenewalFlow: 'getIsRenewalFlow',
        }),
   },
    mounted() {
       this.getIsRenewalFlow !== undefined &&
        someFunc()
    },
    updated() {
        this.getIsRenewalFlow !== undefined &&
        someFunc()
    },
})

someFunc никогда не вызывается даже после обновления state.isRenewalFlow с true или false внутри mutations [MUTATION_TYPES.IS_RENEWAL_FLOW]

Answer 1

Хук

updated связан с изменениями в DOM, если это состояние не обновляет DOM, вы не увидите, что updated вызывается.

С https://vuejs.org/v2/guide/instance.html#Lifecycle-Diagram: