3👍
✅
Switch your handler to an arrow function to avoid changing the scope:
this.razorPayOptions = {
'key': process.env.MIX_RAZORPAY_KEY,
'name': process.env.MIX_APP_NAME,
'description': 'Details ...',
'handler': (request) => {
axios.post('/api/transaction/complete', request)
.then(response => {
console.log(response);
this.toast(response.data, response.status); // this is where the error occurs
});
}
}
Check out this answer for more context
2👍
You can either switch to an arrow function, or capture this
before you define your callback:
this.razorPayOptions = {
'key': process.env.MIX_RAZORPAY_KEY,
'name': process.env.MIX_APP_NAME,
'description': 'Details ...',
'handler': function (request) {
const that = this;
axios.post('/api/transaction/complete', request)
.then(response => {
console.log(response);
that.toast(response.data, response.status); // this is where the error occurs
});
}
}
0👍
The problem is that you are misreading the scope. To solve your problem, change the function for an arrow function.
this.razorPayOptions = {
'key': process.env.MIX_RAZORPAY_KEY,
'name': process.env.MIX_APP_NAME,
'description': 'Details ...',
'handler': (request) => {
axios.post('/api/transaction/complete', request)
.then(response => {
console.log(response);
this.toast(response.data, response.status); // this is where the error occurs
});
}
}
could you read this post https://www.codementor.io/@dariogarciamoya/understanding-this-in-javascript-with-arrow-functions-gcpjwfyuc.
Source:stackexchange.com