Documentation for custom parent element

[CoinCoderBuffalo]

It would be really nice to see an example of how to implement this custom parent feature. The documentation just shows a class override. Can anyone share a working example? Thanks

[danbovey]

In version 1.2.2 that's just been released, we've replaced the need to use a class override.

Instead you can pass a getScrollParent prop that returns the element that you need to use as the scroll parent.

https://github.com/CassetteRocks/react-infinite-scroller#custom-parent-element

<div style="height:700px;overflow:auto;" ref={(ref) => this.scrollParentRef = ref}>
    <div>
        <InfiniteScroll
            pageStart={0}
            loadMore={loadFunc}
            hasMore={true || false}
            loader={<div className="loader" key={0}>Loading ...</div>}
            useWindow={false}
            getScrollParent={() => this.scrollParentRef}
        >
            {items}
        </InfiniteScroll>
    </div>
</div>

I'm working on demos of more scenarios:

• The exsting window example
• Div element as scroller
• Custom parent scroller

Going to tag this issue as v2 so that I can close it when there is a proper demo of custom scroll parent avaialable.

[CoinCoderBuffalo]

Awesome. Thank you.

[WalidKurchied]

In relation to custom parent element when passing getScrollParent prop react complains:

Warning: React does not recognize the getScrollParent prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase getscrollparent instead. If you accidentally passed it from a parent component, remove it from the DOM element

Never Mind Fixed 👍 all i had to do is pull the latest update :)

[wanjakrah]

The documentation says it requires a ref, but it only works when I pass a ReactElement. Has this changed and did the documentation not change with it?

[Alireza17224]

Awesome. Thank you.