Load Data only when needed

How-to Discussions
1

Appologies if this has been asked before.

I am in the final stages of building an social media style application for internal use. I am a web developer so have been using ionic with it’s MVC style and templating options as thats what im most used.

I feel that fuse has so much to offer and understand that it is still in beta. Is there a way to have the app fetch data from an API only when that page view is loaded? I feel that loading it all at once will just be too much for any mobile device to handle. I have looked at the examples and none really show how to go between views. i have also seen the MVC git hub posted here a while ago and not sure if that fits what im after.

Also is there a way to have page templates to show lists of posts and then single posts for example?

Many thanks.

2

Hi!

You could for example use the WhileActive trigger with the Callback action in order to fire of some data fetching when your page becomes active.

I’m not sure how familiar you are with navigation in Fuse, but here is what it could look like using a PageControl.

<JavaScript>
    function fetchDataForPage1(){
       ...
    }
    function fetchDataForPage2(){
       ...
    }

    module.exports = {
        fetchDataForPage1: fetchDataForPage1,
        fetchDataForPage2: fetchDataForPage2
    };
</JavaScript>
<PageControl>
    <Page ux:Name="page1">
        ... content of page 1 ...
        <WhileActive>
            <Callback Handler="{fetchDataForPage1}" />
        </WhileActive>
    </Page>
    <Page ux:Name="page2">
        ... content of page 2 ...
        <WhileActive>
            <Callback Handler="{fetchDataForPage2}" />
        </WhileActive>
    </Page>
</PageControl>

I hope this helps

3

Thanks that helps alot.

4

I’ve try to do this using Navigation and it won’t work at all.


function pp() {
// for(i=1;i<42;i++){
// wDay[i] = {“wd”:i};
// }
wDay = 25;
console.log(“BOOM”);
}
module.exports = {
calitms:calitms,
obsWDay:obsWDay,
pp:pp
};