Views and app structure

Questions
1

Hi All,

Could someone tell me if what I am trying to do is correct?

I have a page with a main view, inside that I have a login page, then when the user logs in it redirects to a main page.

in the main page I have a navbar and another view. i want to redirect the inner view to a new page, but when I do the navbar disappears too? is this correct? ideally i could make a back button appear on the navbar at the same time?

Thanks,

Scott

2

i dont fully understand what you are asking.

But you can use navbar in tow ways. Local, for each page. or common. If you use it local, you must create one nav for each page. If you use it common just one nav will do it.

Common layout:

<div class="view">
  <!-- View common navbar -->
  <div class="navbar">...</div>

  <!-- Pages -->
  <div class="page">...</div>
</div>

https://framework7.io/docs/navbar.html#common-navbar-type

Local FIXED navbar

<div class="page">
  <!-- Fixed navbar goes ALWAYS FIRST -->
  <div class="navbar">...</div>
  <!-- Fixed toolbar goes ALWAYS AFTER navbar -->
  <div class="toolbar toolbar-bottom">...</div>

  <!-- Scrollable page content -->
  <div class="page-content">
    ...
  </div>
</div>

https://framework7.io/docs/navbar.html#fixed-navbar-type

3

ok…

so if i have multiple pages I need to make sure all navbars are the same on each page. seems odd. I dont think i fully understand whats going on there.

I was hoping to use a common navbar like this

<div class="page">
      <div class="navbar">...</div>

      <div class="page-content">
          <div class="view another-view view-init">
             <a href="/another-page/" data-view=".another-view">test link</a>
          </div>
      </div>
    </div>

and have /another-page/ load into the another-view view…

4

you can have one common nav for each view. you dont need the same nav in every page.just use common nav. In your case you will have two, one for each view.

You can also make a navbar component, and import it where you need it. thats what i do.

1 Like