ElyBy-Mirror/accounts-frontend
1
0
Fork 0
mirror of https://github.com/elyby/accounts-frontend.git synced 2024-12-27 23:40:28 +05:30
Code Issues Packages Projects Releases Wiki Activity

#366: ensure the height will be merged immediately after first mount of MeasureHeight

Browse Source
This commit is contained in:
SleepWalker 2017-11-19 20:32:52 +02:00
parent 66d4d2ceb5
commit b277a3c91f
1 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/MeasureHeight.js
View File

@ -36,18 +36,19 @@ export default class MeasureHeight extends PureComponent<{
el: ?HTMLDivElement;
componentDidMount() {
// we want to measure height immediately on first mount to avoid ui laggs
this.measure();
window.addEventListener('resize', this.measure);
window.addEventListener('resize', this.enqueueMeasurement);
}
componentDidUpdate(prevProps: typeof MeasureHeight.prototype.props) {
if (this.props.shouldMeasure(prevProps.state, this.props.state)) {
this.measure();
this.enqueueMeasurement();
}
}
componentWillUnmount() {
window.removeEventListener('resize', this.measure);
window.removeEventListener('resize', this.enqueueMeasurement);
}
render() {
@ -60,7 +61,9 @@ export default class MeasureHeight extends PureComponent<{
return <div {...props} ref={(el: HTMLDivElement) => this.el = el} />;
}
measure = debounce(() => {
requestAnimationFrame(() => this.el && this.props.onMeasure(this.el.offsetHeight));
});
measure = () => {
requestAnimationFrame(() => {this.el && this.props.onMeasure(this.el.offsetHeight);});
};
enqueueMeasurement = debounce(this.measure);
}