@jimmack1963 Hi, thanks for your reply. I tried with put <q-scroll-area> wrap those card content, is still not able to scroll.

I am stuck in create a list by using <q-card></q-card>. These card content is showing some information of bank. I notice when I change to mobile view in order to testing the interface, it can’t scroll, like freezing. But when i refresh my page, it become scrollable. I pasted my code below, help is appreciated!

<template>
<q-layout
ref=“layout”
view=“lHh Lpr fff”
:left-class="{‘bg-grey-2’: true}"
>

    <q-toolbar slot="header" class="glossy">
    <q-btn
        flat
        @click="$refs.layout.toggleLeft()"
    >
        <q-icon name="menu" />
    </q-btn>

    <q-toolbar-title>
        BgWin77
        <div slot="subtitle">Banking</div>
    </q-toolbar-title>
    </q-toolbar>

    <div slot="left">
        <sidebar></sidebar>
    </div>

    <div class="layout-padding row items-start justify-center">

        <q-card inline class="bigger" v-for="image in bankImage">
            <q-card-media>
                <img :src="image">
            </q-card-media>
            <q-card-main>
                <table class="q-table">
                    <thead>
                        <tr>
                        <th class="text-center">Bank Location</th>
                        <th class="text-center">Bank Services</th>
                        <th class="text-center">Others</th>                                                     
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                        <td class="text-center">Location A</td>
                        <td class="text-center">ATM</td>
                        <td class="text-center">Bla Bla</td>                            
                        </tr>
                        <tr>
                        <td class="text-center">Location B</td>
                        <td class="text-center">Online Banking</td>
                        <td class="text-center">Bla Bla</td>                        
                        </tr>
                    </tbody>
                </table>
            </q-card-main>
        </q-card>
        
    </div>

</q-layout>

</template>

<script>
import sidebar from ‘…/components/sidebar/sidebar’

import {
QCard,
QCardTitle,
QCardMedia,
QCardActions,
QCardSeparator,
QCardMain,
QList,
QItem,
QItemMain,
QItemSide,
QItemTile,
QCollapsible,
QRating,
QBtn,
QParallax,
QIcon,
QPopover,
QVideo,
QLayout,
QToolbar,
QToolbarTitle,
QListHeader

} from ‘quasar’

export default {
name: ‘banking’,
components: {
QCard,
QCardTitle,
QCardMedia,
QCardActions,
QCardSeparator,
QCardMain,
QList,
QItem,
QItemMain,
QItemSide,
QItemTile,
QCollapsible,
QRating,
QBtn,
QParallax,
QIcon,
QPopover,
QVideo,
QLayout,
QToolbar,
QToolbarTitle,
QListHeader,
sidebar

},
data () {
return {
stars: 3,
bankImage: [
‘statics/a.png’,
‘statics/b.png’,
‘statics/c.png’,
‘statics/d.png’
]
}
},
methods: {
goTo (path) {
this.$router.push(path)
}
}
}
</script>

<style lang=“stylus”>

</style>

I need to upload an image by using <q-uploader>, but i still have some input field need to be fill in by user, so i plan when user clicked submit button, image and those data will upload to sever together. So i hide the upload button from <q-uploader> and i need upload the image by using that submit button, how to i trigger the <q-uploader> upload event when I click that submit button? Thank in advance!

@leon hi, thanks for you reply, i looking for this!

Hello Everyone, I am new to this quasar-framework, today start doing simple login form. I read the documentation and follow the instruction, I made a <q-btn icon=“create”>New item</q-btn> or <q-input type=“email” />, but I keep get “Unknown custom element: <q-field>” or “Unknown custom element: <q-btn>”. Did I miss import something? Help is appreciated!