React handle event window resize

react-handle-event-resize

import React, { Component } from 'react';
export default class RenderProducts extends Component {
  constructor(props) {
    super(props);
    this.state = {
      innerWidth:  window.innerWidth,
    }
    this.handleResize = this.handelResize.bind(this);
  }
  handleResize(){
    this.setState({innerWidth: window.innerWidth});
  }
  renderStrategy(){
    if(this.state.innerWidth >= 1024) {
      return 5; 
    } else if(this.state.innerWidth >= 1600){
      return 6;
    }
  }
  componentDidMount() {
    window.addEventListener("resize", this.handleResize);
  }
  componentWillUnmount() {
    window.removeEventListener("resize", this.handleResize);
  }
  render() {
  const { products } = this.props;
  const num = this.renderStrategy();
  if(products && products.length === 0) {
    return <div/>;
  }
    return(
      <div>
      //TODO render products with num item
      </div>
    );
  }
}