No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    q-item in q-drawer is missing

    Help
    2
    4
    861
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • N
      ninafar last edited by

      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>
      1 Reply Last reply Reply Quote 0
      • N
        ninafar last edited by

        the q-tem-tile is not showing

        1 Reply Last reply Reply Quote 0
        • J
          jctrebalag last edited by

          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>
          
          1 Reply Last reply Reply Quote 0
          • N
            ninafar last edited by

            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 !:)

            1 Reply Last reply Reply Quote 0
            • First post
              Last post