Usage in Readme.md #51
Description
I found an error while executing an usage of a README.md. And I found what the problem is. It would be helpful to reflect this in the document.
import React, {Component} from 'react';
import { ScrollSync, ScrollSyncPane } from 'react-scroll-sync';
export default class MyComponent extends Component {
render() {
return (
<ScrollSync>
<div style={{ display: 'flex', position: 'relative', height: 300 }}>
<ScrollSyncPane>
<div style={{overflow: 'auto'}}>
<section style={{ height: 500 }}>
<h1>Left Pane Content</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab aperiam doloribus
dolorum
est eum eveniet exercitationem iste labore minus, neque nobis odit officiis omnis
possimus quasi rerum sed soluta veritatis.</p>
</section>
</div>
</ScrollSyncPane>
<ScrollSyncPane>
<div style={{overflow: 'auto'}}>
<section style={{ height: 1000 }}>
<h1>Middle Pane Content</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab aperiam doloribus
dolorum
est eum eveniet exercitationem iste labore minus, neque nobis odit officiis omnis
possimus quasi rerum sed soluta veritatis.</p>
</section>
</div>
</ScrollSyncPane>
<ScrollSyncPane>
<div style={{overflow: 'auto'}}>
<section style={{ height: 2000 }}>
<h1>Right Pane Content</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab aperiam doloribus
dolorum
est eum eveniet exercitationem iste labore minus, neque nobis odit officiis omnis
possimus quasi rerum sed soluta veritatis.</p>
</section>
</div>
</ScrollSyncPane>
</div>
</ScrollSync>
)}
}
Return was missing, and it works normally when added return ( to the line 6.