Why is the state not saved after page reload or are there other options?

Question

linux

Good evening!
I continue to develop a site on vuejs. Previously I used localstorage to store some data (user data, authentication state, etc.), and now I decided to switch to vuex. Having studied the documentation a little, I decided to write a small functionality for authorization.
According to the idea, after the user is authorized, we write the data that the user is authorized to "state" - true. The change in vuex works i.e. in the debug console, this value is displayed normally - true. But after reloading the page, this value disappears - it becomes false.
I have 2 assumptions:
1. I'm doing something wrong
2. I'm not well acquainted with Vuex, and without understanding the essence of the technology, I began to work on it. Those. vuex only stores data without refreshing pages.
Here is the code :

Vuex - Auth.js

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export const Auth = new Vuex.Store({
    state: {
        isAuth: false
    },

    mutations: {
        authentificatedState(state) {
            state.isAuth = true
        },

        // logout() {
        //     state.isAuth = false
        // }
    }
})

export default Auth

In the necessary vue files, I call this.$store.Auth.state.isAuth .
Please tell me what I'm doing wrong, and if possible explain how best to do it. Thanks in advance!)

Answer 1

I have 2 assumptions:
1. I'm doing something wrong
2. I'm not familiar with Vuex...

It's like that. You yourself try to answer the question - WHERE will the state be stored after you leave the page?
If you want to save data between reloads - there are plugins for vuex for this matter, such as vuex-persistedstate , for example.