q-item in q-drawer is missing

[ninafar]

I called the data from state.js . other component calling the same data has no problems.
No errors in console .
here is my codes

<div id=“mob”>
<q-layout-drawer class=“lt-sm” side=“left” v-model=“leftDrawerOpen” content-class=“bg-grey-3”>
<div class=“lt-sm”>
<img alt=“Test Image” class=“responsive” :src=“bannerMain” width=“auto” height=“150” align=“right” style=“float:right”>
</div>

    <div class="lt-sm">
      <q-toolbar class="responsive" style="height:100px; text-align:center; width:auto; ">
        <div id="flex-container-1">
          <div class="search" style="align:bottom; padding-top:20px; padding-bottom:20px; width:260px;">
            <q-search v-model="model" type="text" />
          </div>
        </div>
        <div class="icons" style="position:absolute; left: 210px; padding-bottom: 40px">
          <q-btn inverted size=14px flat round icon="account_circle" />
          <q-btn inverted size=14px flat round icon="mails" />
        </div>
      </q-toolbar>
    </div>

    <div class="list no-border platform-delimiter">
      <q-list>
        <q-scroll-area class="fit">
          <q-item-tile id="text-color" link v-for="link in links" v-bind:key="link.mob" :to="link.url">{{ link.title }}</q-item-tile>
        </q-scroll-area>
      </q-list>
    </div>
  </q-layout-drawer>
</div>

[ninafar]

the q-tem-tile is not showing

[jctrebalag]

Hi,

You are missing the the QItem component and QItemTile is best suited for displaying side images.
Try something like that:

<q-list>
  <q-item v-for="link in links" :key="link.mob" :to="link.url">
    <q-item-main :label="link.title"/>
  </q-item>
</q-list>

[ninafar]

this works for me
<q-list>
<q-item id=“text.color” v-for=“link in links” v-bind:key=“link.test” :to=“link.url”>{{link.title}}
<!-- <q-item-main id=“text.color” :lable=“link.title”/> -->
</q-item>
</q-list>

Thanks !:)