Methods

The Vue configuration object also has a section formethods. Methods are not reactive, so you could define them outside of the Vue configuration without any difference in functionality, but the advantage to Vue methods is that they are passed the Vue instance as context and therefore have easy access to your other properties and methods.

Let's refactor ourescapeKeyListenerto be a Vue instance method.

app.js:

var app = new Vue({
  data: { ... },
  methods: {
    escapeKeyListener: function(evt) {
      if (evt.keyCode === 27 && this.modalOpen) {
        this.modalOpen = false;
      }
    }
  },
  watch: { ... },
  created: function() {
    document.addEventListener('keyup', this.escapeKeyListener);
  }
});