Mire el fragmento de código a continuación, especialmente la parte comentada. Esto se copia de la página React-grid-layout gitHub widthProvider() .
Ref: https://github.com/react-grid-layout/react-grid-layout/blob/master/lib/components/WidthProvider.jsx [Línea:66-67]

Mi pregunta: ¿Cómo implementar este evento de cambio de tamaño en React.js?

Estoy creando un tablero donde puedo abrir un menú emergente para agregar/eliminar los elementos de la cuadrícula. Después de agregar suficientes cuadrículas para desbordar la altura, aparece la barra de desplazamiento Y que se superpone al elemento de la cuadrícula.

Quiero volver a calcular el ancho al agregar la barra de desplazamiento.

La documentación también sugiere usar otro HOC de WidthProvider si necesita una lógica más sofisticada.
Ref: https://github.com/react-grid-layout/react-grid-layout#providing-grid-width

¡Gracias!

 componentDidMount() { this.mounted = true; window.addEventListener("resize", this.onWindowResize); // Call to properly set the breakpoint and resize the elements. // Note that if you're doing a full-width element, this can get a little wonky if a scrollbar // appears because of the grid. In that case, fire your own resize event, or set `overflow: scroll` on your body. this.onWindowResize(); }