How to create dynamic webpage by async route in framework7-Core?

Hello, I am a lawyer but I am really passionate about Information Technology, so i have self-taught and have a bit of IT knowledge. Now I want to create a small-PWApp for my work and I started working with the help of framework7. But now I’m having a bit of a problem about how to create a panel that automatically reloads data from a json file stored on the local every time we click on. Sorry for my little knowledge and bad language has bothered you. I know nothing is free but still look forward to receiving your help. This all that i tried

This is content of panel.f7.html file:

    <div class="panel panel-left panel-cover" data-url='/left-panel/'>
    {{#each user.list}}    

and this is content of route.js:

    import PanelPage from '../pages/panel.f7.html';
    var routes = [
    path: '/left-panel/',
    async: function(routeTo, routeFrom, resolve,reject) {'data.json', function(data) {
    component: PanelPage,
    context: {

and this is content of json file named ‘data.json’ that i want to load data from:

    data = {
    "city": "tokyo",

Thank you so much!

I don’t know what your result is, or if you get some error message on the console. But what I see when looking at your template, is that you are missing an opening <ul> tag?

1 Like

Thank you my friend, I edited my mistake.