[Vuejs]-How to set values in Vuex store in Nuxt.js app

by

0👍

✅

Unfortunately, I have not found solution of this problem like I wanted in .js file, so, here is another solution.

First of all, you need to set no only state and mutations, but also actions:

export const actions = {
  fetchWrongCredentials(ctx, value) {
    ctx.commit('setWrongCredentials', value)
  },
  fetchLogged(ctx, value) {
    ctx.commit('setLogged', value)
  },
  fetchUxd(ctx, value) {
    ctx.commit('setUxd', value)
  }
}

And in your Vue component you need to set values in state using actions, just like that:


  methods: {
    ...mapActions(['fetchWrongCredentials', 'fetchLogged', 'fetchUxd']),
    async login() {
      await login({
        password: this.userPassword,
        login: this.userLogin,
        twoFactor: this.twoFactor
      }).then(result => {
        const jwtRes = jwt.verify(result.token)
        this.fetchLogged(true)
        this.fetchWrongCredentials(false)
        this.fetchUxd(jwtRes.token)
      }).catch(() => {
        this.fetchLogged(false)
        this.fetchWrongCredentials(true)
        this.fetchUxd(null)
        this.error = true
        setTimeout(() => {
          this.error = false
        }, 1000)
      })
    }
  }

In my case, I had to modify that .js file:

import jwt from 'jsonwebtoken'
import cert from '../jwt/public'

export default {
  verify (token) {
    return jwt.verify(token, cert, (err, decoded) => {
      if (err) {
        return false
      } else {
        return { token: decoded.uxd }
      }
    })
  }
}

Leave a comment