how to set timeout in a vueJs method
Add a bind()
call to your function declaration:
setTimeout(function () { this.fetchHole() }.bind(this), 1000)
so that your Vue component's this
is accessible within the function.
Side note: @nospor's accepted answer is cleaner in this particular situation. The bind
approach is a bit more generalized - very useful if you want to do an anonymous function, for example.
Try this: setTimeout(this.fetchHole, 1000)
because this
in anonymous function is attached to that anonymous function not to your main function
The classic issue with contextual this
in JavaScript.
The following part of code shows an easy solution - if you are using ES6 with Vuejs (default config with vuecli y babel). Use an arrow function
setTimeout(()=>{
this.yourMethod()
},1000);
An arrow function does not have its own
this
. Thethis
value of the enclosing lexical scope is used;
Arrow functions - JavaScript | MDN