react-utils

React: useful utils and mixins (WindowSizeWatch, ViewportWatch, ...)

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-utils
1.0.09 years ago9 years agoMinified + gzip package size for react-utils in KB

Readme

React Utils
React: useful utils and mixins (WindowSizeWatch, ViewportWatch, ...)

Installation

Run ``npm install react-utils --save``

Usage

Mixins##

Useful mixins which can help you to build your components more quick and clean.

WindowSizeWatch####

var React = require('react');
var ReactUtils = require('react-utils');
module.exports = React.createClass({displayName: 'MyComponent1',
  mixins: [ReactUtils.Mixins.WindowSizeWatch],
  // ...
  onWindowResize: function (event) {
    console.log(event.width, event.height);
  },
});

ViewportWatch####

var React = require('react');
var ReactUtils = require('react-utils');
module.exports = React.createClass({displayName: 'MyComponent1',
  mixins: [ReactUtils.Mixins.ViewportWatch],
  // ...
  onViewportChange: function (viewport) {
    console.log(viewport.scrollLeft, viewport.scrollTop);
    console.log(viewport.innerWidth, viewport.innerHeight);
    console.log(viewport.outerWidth, viewport.outerHeight);
  },
});