react-height-reporter alternatives and similar libraries
Based on the "Measurement Reporter" category.
Alternatively, view react-height-reporter alternatives based on common mentions on social networks and blogs.
-
react-container-dimensions
Wrapper component that detects element resize and passes new dimensions down the tree. Based on https://github.com/wnr/element-resize-detector
InfluxDB - Purpose built for real-time analytics at any scale.
Do you think we are missing an alternative of react-height-reporter or a related project?
README
Deprecation notice
This is unmaintained. Check out https://github.com/berrtech/react-size-reporter
react-height-reporter
React component-wrapper detecting height changes of its children.
Heavily inspired by react-height but somehow it wasn't accurate enough so I tried to make my own implementation. This implementation uses ResizeSensor from css-element-queries
Installation
NPM
npm install --save react react-dom react-height-reporter
Don't forget to manually install peer dependencies (react
, react-dom
) if you use npm@3.
Usage
import HeightReporter from 'react-height-reporter';
<HeightReporter onHeightChange={height => console.log(height)}>
<div>CONTENT GOES HERE</div>
<div>AND HERE</div>
</HeightReporter>
Options
onHeightChange
: PropTypes.func.isRequired
Callback called on mount and height changes
children
: PropTypes.node.isRequired
Children with static or dynamic height
Pass-through props
You can pass any valid props, like style
or className
to HeightReporter, they will be applied to container
Run
To run example, use npm start
and then go to http://localhost:8080
License
MIT
*Note that all licence references and agreements mentioned in the react-height-reporter README section above
are relevant to that project's source code only.