VueX неправильно хранит данные в магазине

Question

У меня есть страница службы входа в систему и страница профиля учетной записи, а также страница формы обновления учетной записи, и при входе в систему я получаю токен и пользователя обратно из API-интерфейса и устанавливаю данные в хранилище в мутации. Если я хочу обновить профиль, я перехожу на страницу «/ profile / edit» и отправляю форму на сервер, и если запись обновляется на сервере, я возвращаю обновленную запись пользователя в ответ и устанавливаю этот новый объект пользователя. в магазине и перенаправить на страницу профиля пользователя в «/ профиль». Пока все хорошо, я вижу, что атрибуты учетной записи изменились на странице профиля, однако, когда я обновляю страницу, я получаю старый пользовательский объект, полученный после входа в систему, поэтому по какой-то причине новый пользователь не был установить в магазине должным образом, и я не понимаю, что происходит. Буду признателен за вашу помощь. Вот мой код:

Магазин

export default new Vuex.Store({
    state: {
        auth: {
          apiToken: null,
          user: {},
        }
    },
    getters,
    mutations,
  actions
})

Действие входа

login({ commit }, payload){
    axios.post('/api/auth/login', payload)
        .then(response => {
            commit('authenticateUser', {
                token: response.data.api_token,
              user: response.data.user
          })
              localStorage.setItem('token', response.data.api_token)
              localStorage.setItem('user', JSON.stringify(response.data.user))

              router.push('/')
        })
        .catch(error => {
            commit('showErrorAlert')
        })
    }

AuthenticateUser мутация

authenticateUser(state, payload) {
    state.auth.apiToken = payload.token
    state.auth.user = payload.user
    state.auth.signedIn = true
  }

действие saveUserProfile

saveUserProfile({ commit }, payload){
    axios.patch('/api/users/' + payload.get('id'), payload)
       .then(response => {
           commit('saveUserProfile', response.data)
           router.push('/profile')
      })
      .catch(error => {
          console.log(response)
      })
  }

saveUserProfile мутация

saveUserProfile(state, payload){
    state.auth.user = payload
    console.log(state.auth.user)
    # Here I get the updated user from the server with new attribtues
}

В компоненте userProfile у меня есть свойство computed, которое выбирает пользователя из хранилища.

<script>
    export default {
      computed: {
          current_user(){
             return this.$store.getters.currentUser;
             # here, after updating the account I get the new user record but when I refresh the page, I get the old record.
          }
       }
     }
</script>

Когда я попадаю на страницу профиля после обновления учетной записи, я получаю новые атрибуты, но после обновления страницы я получаю старые данные. Это странно, потому что я думаю, что VueX хранит данные в памяти. Я могу подтвердить это, войдя в систему и проверив состояние в консоли браузера VueX. Я вижу, что там есть запись пользователя. Если я, например, захожу в '/ dashboard', я вижу, что запись пользователя все еще там. Это довольно странно. Я что-то не так делаю?

UPDATE

currentUser getter

currentUser: state => {
    return state.auth.user
}