reactjs событие слушатель window.resize

Question

Я новичок в reactjs, и я пытаюсь сделать таблицу точно как этот в скрипку, используя реакцию: http://jsfiddle.net/hashem/crspu/555/

Я создал этот компонент:

export default class Table extends Component { 

    render(){ 
     return <table className="scroll"> 
      <thead> 
       <tr> 
        <th>Head 1</th> 
        <th>Head 2</th> 
        <th>Head 3</th> 
        <th>Head 4</th> 
        <th>Head 5</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Lorem ipsum dolor sit amet.</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
       <tr> 
        <td>Content 1</td> 
        <td>Content 2</td> 
        <td>Content 3</td> 
        <td>Content 4</td> 
        <td>Content 5</td> 
       </tr> 
      </tbody> 
     </table> 
    } 

} 

Не могли бы вы помочь мне в обработке прослушивателя событий изменения размера, как показано в примере из jquery, чтобы реагировать?

Answer 1

Просто зарегистрируйте простые события DOM в componentWillMount() {} и не забудьте отпереть их в componentWIllUnmount() {}.

Answer 2

Это позволит вам следить за изменения размера событий:

componentDidMount() { 
     this.handleResize(); 
     window.addEventListener('resize', this.handleResize.bind(this)); 
} 


handleResize() { 
      console.log("I've been resized!"); 
}