Callback.vue: this.auth is undefined

I just downloaded the Sample Project from the Vue tutorial: Auth0 Vue SDK Quickstarts: Login

and I installed modules, started the server, and all works but not the callback.vue.

when the modals appear and I select any social login button, the callback.vue returns me this: [Vue warn]: Error in data(): “TypeError: this.auth is undefined”

the callback.vue file just have this script code:

  export default {
    name: 'callback',
    props: 'auth'],
    data () {
      this.auth.handleAuthentication()
      return {}
    }
  }

maybe the sample project is missing something? some import perhaps?

1 Like

I was able to reproduce the issue and it seems to be cause by a change in Vue libraries because if you update the quickstart package.json to request the exact versions that are specified there instead of that version or higher then the issue no longer occurs.

In particular, I update the following packages to be:

  • "vue": "2.3.4"
  • "vue-router": "2.7.0"
  • "vue-template-compiler": "2.3.4"

I’ll report internally that this is broken for latest version, but the issue itself will need to be reviewed and either the quickstart updated or a real issue reported to Vue.js libraries so you may want to consider the above workaround if you just want to take a look at the overall flow. I fixed the version of those three packages, but if you’re so inclined you may want to try fixing just the router to 2.7.0 as the issue seems to be props not being passed through router-view.