React element resize observer
A simple React Higher-Order Component who handle element resize detection from your React Components.
Installation
npm install react-element-onresize --save-dev
Browser Support
ResizeObserver Polyfill
WithNOTE: Internet Explorer 8 and its earlier versions are not supported.
Without any Polyfill
Usage
ESNext syntax with decorators
;; @ { superprops; } { const elemResize = thisprops; return <div> <p>width: elemResizecontentRect? Math : 0 px</p> <p>height: elemResizecontentRect? Math : 0 px</p> </div> } ;
ES6 syntax
;; { superprops; } { const elemResize = thisprops; return <div> <p>width: elemResizecontentRect? Math : 0 px</p> <p>height: elemResizecontentRect? Math : 0 px</p> </div> } App;
Polyfill usage
;;; @ { superprops; } { const elemResize = thisprops; return <div> <p>width: elemResizecontentRect? Math : 0 px</p> <p>height: elemResizecontentRect? Math : 0 px</p> </div> } ;