search

schovi / react-iscroll

React component for wrapping iScroll http://iscrolljs.com/
MIT License
236 stars 60 forks source link

horizontal scroll: no autosize #14

Closed Benvorth closed 8 years ago

Benvorth commented 8 years ago

scrollerStyle={{width: '200%'}} will give me a horizonal scrollbar (see issue #4). But how to auto-size the width? What if my content is wider/smaller than 200%?

DmitrySkripunov commented 8 years ago

I have same problem. I have workaround for init scroll. I use the componentDidMount, where i get my scroll content scrollWidth and set this value to state. This state go to scrollerStyle. For example scrollerStyle={{width: this.state.width}}

But if content dinamic (f.e. list of elements) need use componentDidUpdate and forceUpdate methods of the scroll component. But this point i didn't check.

DmitrySkripunov commented 8 years ago

So, i added detect scroll content scrollWidth in to componentDidUpdate method. And this work for me, even for any dinamic data. But React write warnings to console '%ComponentName% is accessing getDOMNode or findDOMNode inside its render(). render() should be a pure function of props and state. It should never access something that requires stale data from the previous render, such as refs. Move this logic to componentDidMount and componentDidUpdate instead.'

But another soutions this problem i don't see at this moment. Do you have any ideas?

schovi commented 8 years ago

Hi guys (and sorry for ignoring for long time).

With update to react-iscroll@1.0.0+ I remove styling of content wrapper. That means you dont style content via IScroll component properties, but directly on child elements https://github.com/schovi/react-iscroll/commit/ecd75bb75667a45d2e14a2eda0a1b7d56c9d54f4

Is this something that will help you? Give me echo if not and I will think about better solution.