Home > Back-end >  How can I store the current user id in the Vue store?
How can I store the current user id in the Vue store?

Time:10-18

I wish to save the UserId when logging in, however, I cannot access the store using this.$store from the store itself, presumably because it is not a Vue component but a JS file.

EDIT: Solution based on an anwer in the code below


export default createStore({
  state: {
    user: null,
    userId: null
  },
  mutations: {
    setUser(state, user) {
      state.user = user;
      console.log("User set in store");
    },
    setUserId(state, userId) {
      state.userId = userId;
      console.log("User ID set in store");
    }
  },
  getters: {
    getUser: state => {
      console.log('Retrieving user...')
      return state.user;
    }
  },
  actions: {
    async login(store, credentials) {
      let response = await(await fetch("http://localhost:4000/api/login", {
        method: "POST",
        body: JSON.stringify(credentials),
        credentials: "include",
      })).json();
      store.commit('setUserId', response.userId);
    },
  },
});```

CodePudding user response:

Your actions have access to the store reference via parameter async login(store, credentials)

So you can call the mutation setUserId from store reference when you get a response

.then(function (response) {
    store.commit('setUserId', response.json().id);
  })
  • Related