What is Vue way to access to data from methods?

Inside methods if you don’t have another scope defined inside, you can access your data like that:

this.sendButtonDisable = true; 

but if you have a scope inside the function then in vue is a common usage of a variable called vm (stands for view model) at the beginning of the function, and then just use it everywhere like:

vm.sendButtonDisable = false;

An example of vm can be seen in the Vue official documentation as well.

complete example:

data: function ()  {
  return {
     questions: [],
     sendButtonDisable : false
  }
},

methods: { 
  postQuestionsContent : function() {
    // This works here.
    this.sendButtonDisable = true;

    // The view model.
    var vm = this;

    setTimeout(function() {
      // This does not work, you need the outside context view model.
      //this.sendButtonDisable = true;
      
      // This works, since wm refers to your view model.
      vm.sendButtonDisable = true;
    }, 1000); 
  }
}

Leave a Comment