Package Exports

react-resize-detector

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-resize-detector) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React resize detector

Event-based Element Resize Detection

This implementation does NOT use an internal timer to detect size changes (as most implementations do). It uses scroll events. Inspired by this article Cross-Browser, Event-based, Element Resize Detection written by Back Alley Coder

Demo

todo

Installation

npm install react-resize-detector

Example

import React, {Component} from 'react';
import {render} from 'react-dom';
import ReactResizeDetector from 'react-resize-detector';

class App extends Component {
  render() {
    return (
      <div>
        ...
        <ReactResizeDetector handleWidth handleHeight onResize={this._onResize.bind(this)} />
      </div>
    );
  }

  _onResize() {
    ...
  }
}

render(<App />, document.getElementById('root'));

API

handleWidth

(Bool) Trigger onResize on width change

handleHeight

(Bool) Trigger onResize on height change

onResize

Function that will be invoked

License

MIT