React Inverted ScrollView
Easily support inverted scrolling in for example chat apps. Maintains a correct scroll position when new content is added.
Installation:
npm install react-inverted-scrollview --save
Example:
;;; state = messages: _ ; { if !thisscrollView return; thisscrollView; } { if !thisscrollView return; thisscrollView; } { console; console; }; { const messages = thisstate; return <ScrollView width=400 height=400 ref= thisscrollView = ref onScroll=thishandleScroll > messages </ScrollView> ; }
API
Props
Prop | Type | Default |
---|---|---|
width | number | 100 |
height | number | 100 |
onScroll | (info: { scrollBottom: number, scrollTop: number }) => any | () => {} |
style | Object {} | {} |
restoreScrollPositionOnUpdate | boolean | true |
children | React.Node or ({restoreScrollPosition}) => Node | Node |
Instance methods
instance;instance;instance;instance;instance;
Check out the examples:
git clone https://github.com/vejersele/react-inverted-scrollview.git
cd react-inverted-scrollview
npm install
npm run storybook