i’m use categories in many pages so i get it on create and store it

	let payload = {
	id:category,
	category:categories[category]			
				}
		payload.category.id=category

and i display it like this

<select v-model="category" class="form-c" >
    <option v-for="option in categories" v-bind:value="option.id">
        {{ option.name_en }}
    </option>
</select>

but i want to use qselect

i want to add more fields by user as he want
and store it as an array to firestore

i want to display categories in dropdown list
how to get it from store and loop the it in options

@dobbel
what this error mean ?

[Vue warn]: Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] do not mutate vuex store state outside mutation handlers."

(found in <Root>)

vue.runtime.esm.js?5593:1888 Error: [vuex] do not mutate vuex store state outside mutation handlers.

i am using firebase to quasar admin panel
and every user have roles
how to store this roles and every change in firebase update the store

what is the wrong with this

i want to check if the user want to go to landing page let him go
else if the admin want to go to admin panel must go to login
else if the admin logged in he can go to any where

every thing is okay but when the user go to landing page he get a white page no content

router.beforeEach((to,from,next) => {
  let loggedIn =LocalStorage.getItem('loggedIn')

  if(to.path == '/'){
    next('/')

  }else if(!loggedIn && to.path !== '/auth'){
    next('/auth')

  }else if (loggedIn && to.path =='/auth'){
    next('/admin')

  }else{
    next()

  }

})

const routes = [
  {
    path: '/',
    component: () => import('layouts/Layout.vue'),
    children: [
      { path: '', component: () => import('pages/Index.vue') },
      { path: '/auth', component: () => import('pages/PageAuth.vue') }
    ]
  },
  {
    path: '/admin',
    component: () => import('layouts/MainLayout.vue'),
    children: [
      { path: '', component: () => import('pages/admin/Index.vue') }
    ]
  },
  // Always leave this as last one,
  // but you can also remove it
  {
    path: '*',
    component: () => import('pages/Error404.vue')
  }
]

export default routes

vue-router.esm.js?85f8:2128 RangeError: Maximum call stack size exceeded
    at parsePath (vue-router.esm.js?85f8:469)
    at normalizeLocation (vue-router.esm.js?85f8:999)
    at Object.match (vue-router.esm.js?85f8:1493)
    at VueRouter.match (vue-router.esm.js?85f8:2741)
    at HTML5History.transitionTo (vue-router.esm.js?85f8:2082)
    at HTML5History.push (vue-router.esm.js?85f8:2414)
    at eval (vue-router.esm.js?85f8:2184)
    at eval (router-auth.js?8dc1:10)
    at iterator (vue-router.esm.js?85f8:2169)
    at step (vue-router.esm.js?85f8:1895)

and is this a secure way ?

@dobbel
i’m trying but nothing is working

@dobbel thank you

@dobbel
this is the code
https://github.com/anas-aw/quasar-rlt

@dobbel Yes, I have read it

and yes when reload the page the language still arabic but the page change to ltr

which part of code you want to see ?

@dobbel yes when i change the language it’s work and the language save in the browser storage when the page reload
the language not change only it’s back to ltr

I did the translation for my project ِ(English | Arabic)
But when I reload any page RTL not working
and Arabic is a RTL language

thank you all problem solved successfully

$ npm link @quasar/cli

@metalsadman said in quasar: command not found:

removing the cli globally

npm uninstall -g @quasar/cli
npm cache clean --force
sudo npm install -g @quasar/cli

if this is what you mean it’s still not working I know the problem, not from quasar but I don’t know how to solve this issue

@metalsadman
this is not my first project
but now it’s not working

@dobbel macOs

@Graypes
it’s not working