Отсутствует узел ref при событии изменения размера

Question

Я пытаюсь вызвать метод setHolePosition для изменения размера, но this.hole пуст, но в первый раз он работает нормально. когда я изменяю размер окна, console.log показывает пустой массив, я не могу понять почему? И где я могу хранить refs в реакции App

import React, {Component} from 'react'; 
import $ from 'jquery'; 

import './indexPageStyles.sass'; 

class IndexPageComponent extends Component { 
    showHole() { 
    setTimeout(() => { 
     this.hole.addClass('hole--visible'); 
     this.setHolePosition(); 
    }, 1000) 
    } 
    setHolePosition(){ 

    const doc = $(document); 
    let dh = doc.height(); 
    let dw = doc.width(); 

    console.log(this.hole); 

    this.hole.css({ 
     top: dh/2 - $(this.hole).height()/2, 
     left: dw/2 - $(this.hole).width()/2 
    }); 


    // TODO: unbind this listener 
    window.addEventListener('resize', this.setHolePosition); 
    } 

    render() { 
    return (
     <div className="indexPage"> 
     <div className="hole" ref={(hole) => { 
      this.hole = $(hole); 
      this.showHole(); 
     }}></div> 
     </div> 
    ) 
    } 
} 

export default IndexPageComponent; 

Answer 1

забыл связать метод с компонентом. this.setHolePosition = this.setHolePosition.bind(this);