Ciao a tutti,

Per lavoro sto sviluppando un'applicazione web Laravel per fornire un meccanismo di autenticazione centralizzato.
In pratica l'applicazione Laravel utilizza l'autenticazione Sanctum e espone delle API, che come da titolo, chiamo via frontend mediante VueJS.
Nell'applicazione Vue ho fino ad ora configurato il routing dell'applicazione ( /login, /apps ), dove /apps può essere visitata solo se l'utente è loggato.
Premetto che è la prima volta che utilizzo VueJs
Ricevuta quindi la response con il token di autenticazione e il messaggio di login avvenuto correttamente, come posso mantenere lo stato dell'utente loggato?

codice: LoginPage.vue

codice:
<template>
  <divclass="hello">
    <h1style="font-size: 28px">{{ msg }}</h1>
    <p>
      Compila il form sottostante con le tue credenziali per effettuare il login
    </p>
    <div>
      <formclass="login-form"@submit.prevent="doLogin">
        <divclass="form-field">
          <inputtype="text"placeholder="email"v-model="user.email" />
        </div>
        <divclass="form-field">
          <input type="password" placeholder="password" v-model="user.password"/>
        </div>
        <divclass="form-action">
          <buttonclass="login-btn"type="submit">Submit</button>
        </div>
      </form>
      <spanv-if="loading&&!show">Loading...</span>
      <divv-else-if="show">
        <p>Login success: {{ successMessage }}</p>
        <p>Token: {{ token }}</p>
      </div>
    </div>
    <p>oppure accedi con la tua identit&agrave; digitale SPID</p>
    <div>TODO - SPID BUTTON HERE</div>
  </div>
</template>

<script>
export default {
  name: "LoginPage",
  props: {
    msg: String,
  },
  data() {
    return {
      user: {
        email: '',
        password: ''
      },
      show: false,
      loading: false,
      successMessage: '',
      token: ''
    }
  },
  methods: {
  async postData(url = '', data = {}) {
    const response = await fetch(url, {
      method: 'POST', // *GET, POST, PUT, DELETE, etc.
      headers: {
        'Content-Type': 'application/json'
      },
        body: JSON.stringify(data)
     });
     
     
     return response.json(); // parses JSON response into native JavaScript objects
    },
    doLogin() {
    this.loading = true
       this.postData('http://localhost:8000/api/login', this.user)
        .then(data => {
          this.token = data['data'].token;
          this.successMessage = 'Login avvenuto correttamente';
          this.loading = false;
          this.show = true;
        });
    
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px00;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 010px;
}
a {
  color: #42b983;
}
</style>