The job of InfiniteScroller is to tell you when the user scrolled down to the 
end of the list.

What to do when you get to the end of the list is up to you. `the most common 
use case is to load paged data. You would need to keep track of whether you 
have more paged data to get.

You’d probably have getMoreData() make an API call to get paged data if there’s 
more data pending.

SmoothDataLoader is complementary in that it’s useful for loading large amounts 
of data in a way that doesn’t freeze the UI.

HTH,
Harbs

> On May 6, 2023, at 11:27 AM, Hugo Ferreira <hferreira...@gmail.com> wrote:
> 
> I didn't quiet understand what this new head SmoothDataLoader does but I
> see that was created to work together with InfiniteScroller
> 
> Harbs <harbs.li...@gmail.com> escreveu no dia quarta, 3/05/2023 à(s) 10:55:
> 
>> I added js:SmoothDataLoader as well.
>> 
>> The bead is expecting data as an array. It should be added using either
>> setData() (to replace the data) or appendData() to add more data to the
>> queue of data being added.
>> 
>> The strand does not need a dataProvider set, but it does need to be able
>> to handle collections and collection change events.
>> 
>> FYI, the SmoothDataLoader might trigger scrollEnd on the InfiniteScroller
>> while adding data, so if you use the two together, make sure you check
>> whether there’s pending data in the SmoothDataLoader before requesting more
>> data on the scrollEnd event.
>> 
>> The InfiniteScroller also does not handle adding a progress indicator to
>> the end of the list. If desired, that would need to be handled separately.
>> 
>> HTH,
>> Harbs
>> 
>>> On May 1, 2023, at 7:14 PM, Harbs <harbs.li...@gmail.com> wrote:
>>> 
>>> I added InfiniteScroller.
>>> 
>>> You can use it like this:
>>> 
>>> <js:List id=“myList”>
>>> <js:beads>
>>> <js:InfiniteScroller scrollEnd=“getMoreData()”/>
>>> </js:beads>
>>> </js:List>
>>> 
>>> If the scroll container is not the actual list, you should use it like
>> this:
>>> <js:Group id=“scrollContainer”>
>>> <js:List id=“myList”>
>>> <js:beads>
>>> <js:InfiniteScroller scrollEnd=“getMoreData()”
>> scrollContainer=“{scrollContainer}”/>
>>> </js:beads>
>>> </js:List>
>>> </js:Group>
>>> 
>>> I’ll try to add the other bead tomorrow…
>>> 
>>> Harbs
>>> 
>>>> On Apr 26, 2023, at 12:46 PM, Hugo Ferreira <hferreira...@gmail.com>
>> wrote:
>>>> 
>>>> I'm sold :)
>>>> 
>>>> When you push that to github, please make a comment here.
>>>> I will test it right a way ;)
>>>> 
>>>> Harbs <harbs.li...@gmail.com> escreveu no dia quarta, 26/04/2023 à(s)
>> 10:43:
>>>> 
>>>>> If you use IntersectionObservers, the callback is only invoked when the
>>>>> observed element comes into view. The beauty of the
>> IntersectionObservers
>>>>> is that it doesn’t matter how the element comes into view. It can be
>> by any
>>>>> kind of scrolling, window resize, or even by changing the visibility
>> of it.
>>>>> It’s very elegant and much more performant than listening to scroll
>> events.
>>>>> 
>>>>>> On Apr 26, 2023, at 12:32 PM, Hugo Ferreira <hferreira...@gmail.com>
>>>>> wrote:
>>>>>> 
>>>>>> But, don't forget that the user can grab the scroll bar and drop
>>>>> somewhere.
>>>>> 
>>>>> 
>>> 
>> 
>> 
>> 

Reply via email to