Problem with router-view



  • Sorry if my question is stupid, but i am having troubles to start developing with quasar. Here my problem:

    0_1495406690436_2017-05-21-181005_1366x768_scrot.png

    The takt component overwrites the drawer, and some times the toolbar too.

    my App.vue file =>

    <template>
    <div id=“q-app”>
    <app-header></app-header>
    <router-view class=“layout-view”></router-view>
    </div>
    </template>

    my app-header component =>

    <template>
    <q-layout>
    <div slot=“header” class=“toolbar”>
    <!-- opens drawer using its ref -->
    <button class=“hide-on-drawer-visible” @click="$refs.leftDrawer.open()">
    <i>menu</i>
    </button>
    <q-toolbar-title :padding=“2”>
    Lean App Tools
    </q-toolbar-title>
    <button>
    <i>mail</i>
    </button>
    <button>
    <i>alarm</i>
    </button>
    </div>
    <q-drawer ref=“leftDrawer”>
    <div class=“toolbar light”>
    <q-toolbar-title :padding=“1”>
    TOOLS
    </q-toolbar-title>
    </div>
    <div class=“list no-border platform-delimiter”>
    <q-drawer-link icon=“alarm” to="/takt">
    Takt Time
    </q-drawer-link>
    <q-drawer-link icon=“alarm” to="/oee">
    OEE - Eficiency
    </q-drawer-link>
    </div>
    </q-drawer>
    </q-layout>

    and finally, my takt component =>

    <template>
    <q-layout class=“layout-padding”>
    <h1>Text</h1>
    </q-layout>
    </template>

    What am i doing wrong ? I am reading the docs, but still didn’t get it

    If it helps, here the git => https://github.com/matheus-rossi/lean-tools



  • You cannot have nested q-layouts.

    .layout-view muste be a child of q-layout

    Will post more help tomorrow. Meawhile re read the docs! 😉


Log in to reply
 

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.