Load more button
Heres the scenario, i have signal of an array which hold list of words. Then i show them with <For /> component. Now i dont fetch all words in single fetch, i have "load more" button if you need more word. Now the problem is i dont know how to fetch and push new words to the signal. My initial thought was to put that array of words inside another signal array of pages, then we iterate each page with <For/> and we then iterate each word. The problem was when i fetch more pages everything get re-rendered which cause a blink. How do i get around this? Any suggestion?
6 Replies
<For /> uses reference equality, so just create a new array keeping references to the existing objects unchanged, and add new ones.
Nesting arrays sounds unneeded, why would you do that?
If you want to automatically load more words, we have https://primitives.solidjs.community/package/pagination#createinfinitescroll to help you.
Solid Primitives
A library of high-quality primitives that extend SolidJS reactivity
Thanks!
Because it would be convinient to just push another resources for next page
I was going to use this but i keep scratching my head reading the docs at the end i just use an array of words and then fetch normally
Keeping the reference while updating the array is the key.
Thanks for the feedback. Which parts of the docs did you find confusing?
No i think its just me hehe
I think i didnt really understand the concept. Im expecting to pass array of content per page but in createPagination im supposed to pass JSX.Element