I'm new in Vue and I'm trying to change this.data using a function.
App.vue:
data () {
return {
data: null
}
},
beforeMount: async function () {
function something (response) {
this.data = response
}
something('hello')
console.log(this.data)
}
Error:
Cannot read property 'data' of null
"this" is lost in context.
read This Operator on mozilla
use arrow functions to preserve the scope of this, or bind the function
data () {
return {
data: null
}
},
beforeMount: async function () {
const something = (response) => {
this.data = response
}
something('hello')
console.log(this.data)
}
Just use the methods section.
data () {
return {
data: null
}
},
methods: {
update(response) {
this.data = response
}
},
beforeMount: async function () {
this.update('hello')
console.log(this.data)
}
This error is because of 'this' not getting the bind context. You can use either arrow function(Recommended ES6 way) or using bind(this) function
const something = (response) => {
this.data = response
}
thisis being bounded when you define the function like that. try defining the function asconst something = (response) => {}instead and see if that fixes it.