Hello all - I am looking for a way to refresh updated App State-based values within a component from the parent page without reloading the entire page.
I have the following:
-Page
--Listview (API call using Infinite Scroll to load data)
-- -Component A
-- -Component B
-- -Component C
-- -Component D
-- - ... etc for the entire API call
Each component loads a specific value that is stored in App State (using App State specifically to handle cross-page functionality) and that App State may change.
What I would like to do is update say Component B from an action on Page, without the ListView itself needing to be refreshed. If it is refreshed, then it re-calls the API, and re-scrolls the ListView. What I am trying to do is have the ListView not re-call / re-scroll and instead, from an action called on Page, just update the Components themselves to reflect the new App State.
Any ideas on how to do this? Looking for strategies, so no need to give me specific examples etc - any help would be greatly appreciated as this is a key hurdle for me to get things working.
PS: If you are wondering why I have this structure... the Components that are loaded within the Listview can be clicked on to "view more details". On that new page, you can change items that are also shown on the original page. Because of that, I use App State to store the values that are show on both pages and save them in a List by index. This theoretically would let me share changes between the "view Component" page and the original page. Issue is that I cannot re-fresh the individual components on the original page without re-setting everything with a new API call.
Thank you!