未捕获的引用错误：未定义“xxx”（VUE）

Question

New to Vue, trying to figure out something. I'm using this "Data":

data() {
        return {
            currentPage: 0,
            nextPage: '',
            previousPage: '',
            left: '',
            opacity: '',
            scale: '',
        }
    },

Trying to use the data variables inside a method looks like this:

methods: {
        isStageOneDone: function () {
            var animating;
            if(animating) return false;
            animating = true;
            this.currentPage;
            console.log("CurrentPage =>", currentPage);
   }
}

But I keep getting this error:

Uncaught ReferenceError: currentPage is not defined

What am I missing? I looked into the Vue docs and it seems ok I think

Edit: Is it possible that because of the return() the error occurs?

Answer 1

Hi you should define your methods like below

methods: {
 isStageOneDone(path, data) {
        var animating;
        if(animating) return false;
        animating = true;
        this.currentPage;
        console.log("CurrentPage =>", this.currentPage);
 }
}

lets try it out i think it will work for you

Answer 2

You have to add "this" key for access to defined inside data attributes. for example:

 data(){ return{ variable:'example' } }, methods:{ exampleFunc(){ return this.variable; } }