Hi @igor_local with your code, it’s more easier

globaly, if all your checkbox are the same data, you cant have the behavior you expect.

if your v-for point on an array of object, your checkbox must to point on a data of your object

for exemple:

in your data
posts: [
{ id: 1, title: ‘my first title’, check: false},
{ id: 2, title: ‘my second title’, check: false},
…
]

in your template:
<div v-for="(post, i) in posts">
{{ post.title }}
<q-checkbox v-model=“post.check” />

Now that I see the solution, I understand.
thank you so much

Thank you for your answer, however, I do not understand what you want me to do.

You propose that I create a new data replacing “options” in the v-model? and I suppose I have to create a watcher to follow and modify this new data according to the evolution of options?

Hi all,

I have a menu in a parent.
When I click on the menu button, I want to trigger a dialog in a child.

This works well, except when the user clicks on the dialog overlay to close it.

How to spend a $ emit on click on the overlay?
Actually, if an user clic on overlay i have this error:

Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "options"

The parent’s watered-down code:

<template>
<component :options="this.options" :is="componentName" @update-options="optionsProps"></component>
<q-btn
        fab
        color="positive"
        icon="fas fa-cog"
        class="absolute-center no-shadow"
        @click="optionsProps"
        style="border: 4px solid white; top: 0; right: 0; transform: translateX(-50%), translateY(-30%);"
      />
</template>
<script>
export default {
    data () {
        return {
          options: true
       }
    },
    methods: {
        optionsProps () {
            this.options === true ? this.options = false : this.options = true
            return this.options
        }
    }
...

The child’s watered-down code

<template>
    <q-card>
        <q-dialog square full-width v-model="options" position="bottom" class="">
            <q-card-section class="row items-center">
                <div class="text-h6">{{ title }}</div>
                <q-space />
                <q-btn icon="close" flat round dense @click="close" />
            </q-card-section>
        <q-card-section class="items-center no-wrap">....</q-card-section>
    </q-card>
</template>
<script>
export default {
    props: {
        options: { type: Boolean, default: false }
    },
    methods: {
       activate: function (el) {
            this.$emit('update-options', false)
            this.filter = el
        },
        close () {
            this.$emit('update-options', false)
        }
    }
}...

Thanks for your help,

Sorry, I’m answering myself, I found 2 tracks.

First: IndexedDB
https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa
https://developer.mozilla.org/fr/docs/Web/API/API_IndexedDB/Using_IndexedDB

Second:
SQLite
https://forum.quasar-framework.org/topic/3002/sqlite-cordova-plugin

I will use IndexedDB.
thank you

Hi, I am a new quasar user and I am trying to create an android app.

I would like to store user preferences, but how? Coockies? Session? Vuex?
For a website I will have saved these values ​​in database, but for an application?

Could you tell me how to do it?
thanks in advance.