Как отследить изменение состояния при переходе с одной страницы на другую?

Есть две страницы Questions и Home. На странице Questions есть форма, которая отправляет данные на сервер. Также по submit мы переходим со страницы Questions на страницу Home. Все я делаю с использованием vuex.

function setAnswers(answers) {
    store.dispatch('setAnswers', answers);
    router.push({ name: 'Home' });
}

Далее работает данный action

async setAnswers({ dispatch, commit }, answers) {
    await Account.setAnswers(answers);
    dispatch('getPastPeriods');
    dispatch('getPredictablePeriods');
}

Который соответственно вызывает два других actions.

getPast({ commit }) {
    return Account.getPast(response => {
        return commit('SET_PAST', response.data);
    });
},
getNext({ commit }) {
    return Account.getNext(response => {
        return commit('SET_NEXT', response.data);
    });
},

Соответственно срабатывают следующие мутации

SET_ANSWERS(state, answers) {
    state.answers = answers;
},
SET_PAST(state, past) {
    state.past = past;
    сonsole.log('past',past);
},
SET_PREDICTABLE_PERIODS(state, next) {
    state.next = next;
    сonsole.log('next',next);
},

При этом на странице Home past и next отслеживаются через computed и передаются другому компоненту.

<template>
    <div class="w-full h-full">
        <Component
            :past="past"
            :next="next"
        />
    </div>
</template>
<script setup>
import Component from '@/components/template/Component.vue';
import { computed } from 'vue';
import { useStore } from 'vuex';

const store = useStore();

const past = computed(() => store.state.past);
const next = computed(() => store.state.next);
</script>

В консоли я вижу, что эти значения устанавливаются, но в Home данные не обновляются. Каким образом можно решить данный случай и может я просто что-то не так выполняю. Буду рада любой помощи)