Fork Idea - Infinite scrolling

[dcworldwide]

HI @eiriklv, thanks for the great project. 👍 I have a general question. I need to extend your work to add infinite scrolling. My plan is to fork your work and make my sub-project available to others. I'm pretty new to React and Masonry, so i was wondering if you had any thoughts on how you would solve this problem? Furthermore, are there any infinite scrolling libs that you know of which would be a good fit for integrating with your work? thanks

[eiriklv]

Hi @dcworldwide, and thanks!

There's already an example of react-masonry-mixin and infinite scroll here:

• Code: https://github.com/eiriklv/hearsay-frontend/blob/master/client/javascript/modules/components/article-box.js
• Live demo: http://www.hearsay.me

It's using a fork of react-infinite-scroll :-)

[eiriklv]

Though I see now that this is using the old react-masonry-mixin, which was my first approach, but you should be able to do something similar.

[eiriklv]

Something like in the fashion of:

<Masonry {...}>
  <InfiniteScroll {...}>
    {elements}
  </InfiniteScroll>
</Masonry>

[dcworldwide]

@eiriklv Very neat! I'm going to spend some time tomorrow getting this working. Thanks again!

[eiriklv]

@dcworldwide No worries! Have fun :-)

[bfic]

@dcworldwide could you be so kind and share your approach ? I am trying to do same thing (using react-mysonry-component with react-infinite-scroll)

[dcworldwide]

Hey @bfic

@eiriklv's approach above works well. I had no issue getting it working, but in the end, I decided not to use react-inifinite-scroll but instead used https://github.com/joshwnj/react-visibility-sensor. My choice was largely because I didn't feel comfortable using a fork, but that is just a preference. Either works well.

[matthewlilley]

Thanks @dcworldwide, exactly what I was looking for.