Skip to content Skip to sidebar Skip to footer

Framework7 Page Init Event Not Firing

I am trying to use framework7 and cannot get the page init event to fire. The code I am using is very simple, and I have followed the documentation very carefully. No matter what I

Solution 1:

@SuperDuperApps, I managed to run the code. Pretty much like what Djiggy suggested if you delay the init it works for me (below). But if you don't want to it to be called on the first page and only subsequent pages, then the code u have works. Just try adding a link (to about.html) similar to what is in the docs and it works

var myApp = new Framework7({
    init: false
});
var $ = Dom7;
var mainView = myApp.addView('.view-main', {
    dynamicNavbar: true
});
$(document).on('page:init', function (e) {
    alert("processing page init");
});
myApp.init()

Note: PageInit is not called on back.


Solution 2:

It may be solved by init app manually (sometimes event is not fired when content is in the first file loaded)

Or try to trigger your home page callback (third point of link)


Solution 3:

There is detailed information on the following page.

https://framework7.io/docs/page.html#page-events

I used it like this: in app.js

var app = new Framework7({
    id: 'io.framework7.testapp',
    root: '#app',
    ...
    on: {
        pageInit: function (e, page) {
            console.log('page init -> route.name=' + e.route.name);

            if(e.route.name === "searchPage") {
                app.methods.searchPageInitMethod(e);
            }
        },
    },
    methods: {
        searchPageInitMethod: function (e) {
            console.log("Page Route Params:" + app.views.main.router.currentRoute.params)
        },
    },
    ...
}

My route table(routes.js) like this:

var routes = [
    ...
    {
        name: "searchPage",
        path: '/search/:keyword/',
        url: './pages/page-search.html',
    },
    ...
];

Solution 4:

This has changed as of version 3. Now, doing the exact same thing can be accomplished by doing this:

var myApp = new Framework7({
    ...
    init: false
});

myApp.on('init', function(e) {
    alert('app init event fired');
});

myApp.init();

Post a Comment for "Framework7 Page Init Event Not Firing"