Am playing with Framework7 for mobile app development.
Am facing a small issue now. I have the following setup:
var $$ = Dom7;
var app = new Framework7({
//.....
routes: routes
});
var homeView = app.views.create('#view-home', {
url: '/'
});
var settingsView = app.views.create('#view-settings', {
url: '/settings/'
});
And now I have created a new page inside /pages/new-msg.html
with the following content:
<div class="page" data-name="new-msg">
<div class="navbar">
<div class="navbar-inner sliding">
<div class="left">
<a href="#" class="link back">
<i class="icon icon-back"></i>
<span class="ios-only">Back</span>
</a>
</div>
<div class="title">Create New Message</div>
</div>
</div>
<div class="page-content">
<div class="block block-strong">
testing...
</div>
</div>
</div>
And my routes.js
is like this:
routes = [
{
path: '/',
url: './index.html',
},
{
path: '/new-msg/',
url: './pages/new-msg.html',
},
//.......
];
And inside my index.html
(my home page), I have created a FAB button like this:
<div class="fab fab-right-bottom color-red">
<a href="/new-msg/" class="link">
<i class="icon f7-icons">add</i>
</a>
</div>
The problem is, when I click on the FAB button(add button) at runtime, on the first click it won’t open up the New Msg
page. But if I click on the button again, it opens up. And if press back button(from the New Msg
page) and clicks on the button again(single time) it opens up without issues.
So, only during the first time, the first click doesn’t open up the New Msg
page. I think its not loaded to the DOM ? Is there any workaround for this so that I can open it up in the first click itself?
Thank you