Confused: Pageinit and Routing

Questions
1

I am new to coding with Framework7 with a rudimentary understanding of Javascript so I apologise in advance, as this is a learning process for me.

I have created a Phonegap app using Framework7 and am trying to connect it with the Wordpress API to get some information on the page. To some extent I have achieved this.

Using :-

var MyApp = new Framework7({
    // App root element
    root: '#app',
    // App Name
    name: 'My App',
    // Enable swipe panel
    panel: {
      swipe: 'left',
    },
    // Add default routes
    routes: [
        {   
            name: 'index',
            path: '/index/',
            url: 'index.html',
            options: {
                transition: 'f7-parallax',
              },
        },   
      {
        name: 'about',
        path: '/about/',
        url: 'about.html',
        options: {
            transition: 'f7-parallax',
          },
      },
      {
        name: 'report',
        path: '/report/',
        url: 'report.html',
        options: {
            transition: 'f7-parallax',
          },
      },
    ],
  });

I then have used this to get json information from the Wordpress API, loop through it and add it to my index page. It just a test for basically calling the post titles from the wordpress site. This works and I get the titles outputted on my page. I’m sure this fundamentally isn’t the correct way to do it, but i am using a mishmash of tutorials.

MyApp.request.json('https://myurl.com/wp-json/wp/v2/posts', function (mydata) {
    Object.keys(mydata).forEach(function(i){$$('#listview').append('<p>'+mydata[i].title.rendered+'</p>')
    });
});

The problem is that when I move between pages, this disappears. I have read up and people suggest that you add the code to the pageInit.

I have attempted to add the above code to a pageinit function in routes like so:

on: {
pageInit: function(e,page) {
if(e.route.route.name == index) {
 //code from above
}

but it doesn’t work. (an alert will fire once)

i’ve also tried to put the init inside the route itself with no luck,
So fundamentally I don’t understand how the routes and keeping data on a page works.
Can someone point me in the right direction.

Thankyou.