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

    Setting dark mode does not save, always returns to automatic when reopening the app

    Framework
    2
    6
    1022
    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.
    • jonathan_on
      jonathan_on last edited by

      I’m deploying dark mode, but when testing on the device, it starts on automatic, so I change using this.$q.dark.set(true), however when closing and reopening the application, it always returns to the default, in the false case . Am I wrong in some configuration?

      <template>
          <q-layout view="lHh Lpr lFf">
              <q-list :dark="dark">
                  <q-item
                       tag="label"
                       v-ripple
                  >
                  	<q-item-section>
                  		<q-item-label>Dark theme</q-item-label>
                 	</q-item-section>
                  	<q-item-section side >
                  		<q-toggle v-model="dark" @input="changeDarkMode" />
                  	</q-item-section>
                  </q-item>
              </q-list>
          </q-layout>
      </template>
      
      <script>
      export default {
      	name: 'MainLayout',
      	created() {
      		this.dark = this.$q.dark.isActive;
      	},
      	watch: {
      		'$q.dark.isActive' (val) {
      			this.dark = val;
      		}
      	},
      	data() {
      		return {
      			dark: null
      		}
      	},
      	methods: {
      		changeDarkMode(value) {
      			this.dark = value;
      			this.$q.dark.set(value);
      		}
      	}
      }
      </script>
      

      And, in my quasar.conf.js:

      config: {
      	dark: 'auto' // or Boolean true/false
      }
      

      I appreciate the help.

      metalsadman 1 Reply Last reply Reply Quote 0
      • metalsadman
        metalsadman @jonathan_on last edited by

        @jonathan_on in what mode? better save the dark settings in localStorage.

        jonathan_on 1 Reply Last reply Reply Quote 0
        • jonathan_on
          jonathan_on last edited by

          This post is deleted!
          1 Reply Last reply Reply Quote 0
          • jonathan_on
            jonathan_on @metalsadman last edited by

            @metalsadman I thought about it, but I thought that somehow the plugin maintained the state on its own.

            1 Reply Last reply Reply Quote 0
            • metalsadman
              metalsadman last edited by metalsadman

              @jonathan_on you didn’t answer my question. it won’t if you refresh/close your app, anyway just save the state in localstorage.

              jonathan_on 1 Reply Last reply Reply Quote 0
              • jonathan_on
                jonathan_on @metalsadman last edited by

                @metalsadman Sorry! In any way, both in the browser when refreshing and in the device, closing and opening again. But I followed your tip, thanks.

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