this is undefined at axios promise - vuejs - html

Question

Im registering my axios globally and then using it at every component using this.$axios
I have a save method and items which is an array at my component data.
At my save method i have this piece of code:
this.$axios
.put(`HardwareBoardTracking`, this.items[this.editedIndex])
.then((res) => {
console.log(res);
this.items[this.editedIndex].actions.forEach((test) => {
this.items.forEach((card) => {
if (card.id != this.items[this.editedIndex].id) {
this.addnewActionToCard(card, test);
}
});
});
})
.catch((err) => {
console.log("error caught");
console.log(err);
Object.assign(this.items[this.editedIndex], elementForFail);
});
When getting to then block with debugger i can see this is undefined
This is the error i get:
Uncaught (in promise) TypeError: Cannot convert undefined or null to object
at Function.assign (<anonymous>)
for testing purposes i tried to add testMethod and call it from the promise like this:
testMethod() {
console.log("Test Method");
console.log(this);
},
save() {
const elementForFail = { ...this.editedItem };
if (this.editedIndex > -1) {
Object.assign(this.items[this.editedIndex], this.editedItem);
this.items[this.editedIndex].CompletedAllActions = true;
this.items[this.editedIndex].actions.forEach((element) => {
this.addnewActionToCard(this.items[this.editedIndex], element);
});
this.$axios
.put(`HardwareBoardTracking`, this.items[this.editedIndex])
.then((res) => {
console.log(res);
this.testMethod();
this.items[this.editedIndex].actions.forEach((test) => {
this.items.forEach((card) => {
if (card.id != this.items[this.editedIndex].id) {
this.addnewActionToCard(card, test);
}
});
});
})
.catch((err) => {
console.log("error caught");
console.log(err);
Object.assign(this.items[this.editedIndex], elementForFail);
});
And the method is called and inside it it this is defined properly and logged to consol like this:
VueComponent {...}
I Found this answer https://stackoverflow.com/a/45217521 which looks like exactly what i need, But none of the solution works.
If i try the .bind(this) solution, this is still undefined but it does continue with execution and then i get this error:
vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in v-on handler: "TypeError: this.$axios.put(...).then(...).bind is not a function"
html tag added for colorized code