williamcruzme / vue-gates

🔒 A Vue.js & Nuxt.js plugin that allows you to use roles and permissions in your components or DOM elements, also compatible as middleware and methods.
https://williamcruzme.github.io/vue-gates/
MIT License
263 stars 31 forks source link

permissions gets updated after page refresh. #42

Open Xatta-Trone opened 3 years ago

Xatta-Trone commented 3 years ago

Hello, thank you for this awesome plugin.

I am using NUXT js and my problem is....the permissions does not apply automatically until I refresh the page manually.

in login section

async userLogin() {
      try {
        let response = await this.$auth
          .loginWith('laravelSanctum', {
            data: this.login,
          })
          .then((res) => {
            console.log('asdfsf')
            this.$axios
              .get('/admin/permissions')
              .then((res) => this.$gates.setPermissions(res.data))
              // .then((res) => this.$forceUpdate())
              .catch((err) => console.log(err))
          })
      } catch (err) {
        console.log(err)

        if ((err.response.status = 401)) {
          this.getmessage(err.response.data.message)
        } else {
          this.getmessage('Something went wrong')
        }
      }
    },

in sidebar

v-show="$gates.hasPermission('' + item.permission + '')"

after login, I am redirecting to the dashboard page. but there every permission returns false. 

now, if I refresh the page manually, then the permission system works. 

how to resolve this issue ? 

after login

image

after refresh

image

jhosepharaujo commented 3 years ago

Ho @Xatta-Trone, try this https://github.com/williamcruzme/vue-gates/issues/15#issuecomment-594624573