VueJS: Unprepared (in promise) TypeError: Unable to read the "push" property from undefined

Question

I get the message "can not read property push of undefined": here is my vueJs code:

data:{ CoIsignedListUID:[] } methods:{ fetchCoISigned: function () { this.$http.get('/cimsm/public/api/fetchCoIsigned/' + this.conflictofInterest.complaintID).then(function (response) { var data = response.data; this.$set('CoIsignedList', data); data.forEach(function (detail) { this.CoIsignedListUID.push(detail.uID); }); }); 

what am I doing wrong? Thanks

Answer 1

this.CoIsignedListUID is undefined

perhaps because this not this , which in your opinion

you have to do

 var _this = this 

out of function and then

 _this.CoIsignedListUID.push(detail.uID); 

Alternatively, you can use the ES2015 arrow syntax.

Instead:

 .then(function (response) {} 

Using:

 .then((response) => {} 

'this' is now available inside the function, so there is no need to create a new variable. Full description here .

Answer 2

this in the forEach callback is not vue.js this . You can do this to solve this problem.

 this.$http.get("...").then(function(response){ var data = response.data; this.$set('CoIsignedList', data); var that = this; data.forEach(function (detail) { that.CoIsignedListUID.push(detail.uID); }); });