CODEWITHSUNDEEP
javascripthtmlcanvasdom-events
Ben Poon
Ben Poon

Reputation: 125

Canvas reference lost when resizing

I've got a Grid "class" that listens to resize events on window and calls a function, which right now is simply logging a reference to a DOM element. Accessing the el before resize works perfectly, and it works the same way after, but during my resize event callback, it's undefined. What gives?

function Grid (el) {
  this.el = document.querySelector(el);
  this.init();
}

Grid.prototype.init = function() {
  window.addEventListener('resize', this.resizeCanvas, false);
}

Grid.prototype.resizeCanvas = function() {
  console.log(this.el);
}

Whenever I resize browser, undefined is logged.

Upvotes: 0

Views: 51

Answers (1)

bjvanminnen
bjvanminnen

Reputation: 424

resizeCanvas is not being called with Grid's context. One option would be to do something like this instead:

Grid.prototype.init = function() {
  var self = this;
  window.addEventListener('resize', function () {
    self.resizeCanvas();
  }, false);
}

Upvotes: 2

Related Questions