Virtual list loading data from server as user scrolls

With a Vue virtual list, what is the best way to load hook into an scroll event to load more data from server as user scrolls down? I don’t see any exact documentation for this scenario, but I did see some code for a simple list with infinite scroll in Vue:

I tried the same thing with virtual list, but the infinite event is not firing.

There’s also documentation on infinite scroll includes a list example hooking into:

$$('.infinite-scroll-content').on('infinite', ...

But it’s not a Vue pattern.

Is there a way to hook into the event directly onto the list?

Yes, use infinite scroll + Vl’s API appendItems or replaceAllItems

The infinite event is not firing, even if I remove virtual list directive from the list. The page is inside a popup, so I’m not sure if that’s supported?

It will be inititialised if it is inside initialized View, otherwise enable it with infinite api

Ah yes. I had to do this:


Why does auto-initialization of infinite scrolling require a view? Is it possible for the infinite directive to do that?