What is the proper syntax for a page Callback in v2

What is the proper syntax for a page Callback in v2?
I have tried the below code but getting the error “TypeError: myApp.onPageInit is not a function”

  myApp.onPageInit('about', function (page) {
  console.log('About page initialized');
  console.log(page);
});

Ok, found this link (see below) and looks like we use the router now.

component: {
      template:..
   on: {
    pageInit: function () {
      // do something on page init
    },

https://blog.framework7.io/mastering-v2-router-958ea2dbd24f

1 Like

Look Kitchen Sink v2 - Component page. There are hooks (callback) in action…

2 Likes

Also possible with global events as:

app.on('pageInit', (page) => {
  console.log(page);
});

Where should I put it?

It doesn’t work for me:

// Init App
var app = new Framework7({
  root: '#app',
  theme: theme,
  data: function () {
    return {
      user: {
        firstName: 'John',
        lastName: 'Doe',
      },
    };
  },
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  routes: routes,
});

app.on('pageInit', function(page){
  console.log(page);
});

Works for me. Just checked in v2 Kitchen Sink. If you need to catch home page init event then add it in params:

var app = new Framework7({
  root: '#app',
  theme: theme,
  data: function () {
    return {
      user: {
        firstName: 'John',
        lastName: 'Doe',
      },
    };
  },
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  routes: routes,
  on: {
    pageInit(page) {
       console.log(page)
    }
  }
});
1 Like

It’s working now for all pages ! But event fires twice - why?

Another question :slight_smile:

action-sheet page (ks2) has own pageInit hook, global hook doesn’t work in that case - how turn on pageInit global hook either?

Fires two times because you have two views in kintchen sink. Fires for each view.

Global hook doesn’t overwrite event defined in component page. I see they are both fired