vuetifyjs / nuxt

Nuxt.js + Vuetify.js starter project template.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

set vuetify theme from store state

alphaelf opened this issue · comments

hi, i can set theme via store state this way

store/index.js:

export const state = () => ({
   options: null
})
export const mutations = {
    SET_OPTIONS(state, opt) {
        state.options = opt
    }
}
export const actions = {
    async fetch_options({ commit, dispatch }){
        try {
            const data = await this.$axios.$get('app/options')
            commit('SET_OPTIONS', data )
        } catch (e) {
            console.error(e.message)
        }
    }
}

plugins/vuetify.js:

import Vue from "vue"
import Vuetify from "vuetify"

export default ({ store }) => {
  Vue.use(Vuetify, store.state.options)
}

middlware/base.js

let _ = require("lodash")
export default async ({ store, app }) => {
  if (_.isNull(await store.state.options)) {
    await store.dispatch("fetch_options")
  }
}

it work on load page
but not reactive, when i change store theme state in route change the vuetify theme not change
where am i wrong?

update:
actually i get defualt theme from fetch_options action when user is not authorized and when user authorized get user theme in same action and my store state get changes but vuetify no.