Vuex: Impossible de lire la propriété '$ store' d'undefined

Question

J'ai créé un magasin dans vue.js et je peux accéder aux paramètres d'état dans la partie calculée d'un composant:

computed: {
    BASE_URL () {
    return this.$store.state.BASE_URL;  
  }

Cependant, lorsque j'essaie d'accéder au magasin dans les méthodes du même composant:

  methods: {

    register: function () {
          axios.post( this.BASE_URL + "/web/register", {
          username: this.username,
          password: this.password,
          email: this.email
        }).then(function(data){
          this.$store.commit('saveToken', data.token);
          console.log('token is set to:',  this.$store.state.token)
        });
    }  
 },

Je reçois cette erreur sur la console:

TypeError non capturé (en promesse): Impossible de lire la propriété '$ store' de non défini

J'ai aussi essayé $store sans this mais obtient la même erreur.

Qu'est-ce qui ne va pas ici? Comment puis-je le réparer?

Answer 1

Vous utilisez une fonction javascript au lieu d'une fonction flèche. Essayez ceci et cela devrait fonctionner.

 methods: {
    register () {
          axios.post( this.BASE_URL + "/web/register", {
          username: this.username,
          password: this.password,
          email: this.email
        }).then( (data) => {
          this.$store.commit('saveToken', data.token);
          console.log('token is set to:',  this.$store.state.token)
        });
    }