Hi i am trying to import my Auth module’s state to an external js from my Store folder but, it returns undefined.

my goal here is to include my token to my Api but Auth returns empty. and when i checked it out to my dev tools its not empty.

// here is the external js (Api.js)
import Vue from 'vue'
import Auth from '../store/Auth'  // <- this returns an empty structure of my state

export default () => {
  return Vue.prototype.$axios.create({
    baseURL: `http://localhost:3000/`,
    headers: {
      Authorization: `Bearer ${Auth.state.token}`
    }
  })
}

here is my store/index.js

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'

import Auth from './Auth'
import Bank from './Bank'
import Category from './Category'
import Courier from './Courier'
import Attribute from './Attribute'
import Shop from './Shop'
import Product from './Product'

Vue.use(Vuex)

const store = new Vuex.Store({
  strict: true,
  plugins: [
    createPersistedState()
  ],
  modules: {
    Auth,
    Bank,
    Attribute,
    Category,
    Courier,
    Shop,
    Product
  }
})

export default store

Please help me thank you!

hi newbie here,

i just want to know if is it possible to create on your own method for uploading? i tried uploadfactory but it fails me. base on my understanding upload factory can be use to create on your own uploader so i made on my own but as ive said its not triggering my method…

here is my code:

<q-uploader
          url=""
          :upload-factory="uploadFactory"
        />

methods: {
    async uploadFactory (file, updateProgress) {
      let vm = this
      try {
        console.log('test')
        var data = {
          productImage: file,
          userId: vm.user._id
        }
        var uploadUserProfile = await UserService.UploadUserProfile(data)
        console.log(uploadUserProfile)
      } catch (err) {
        vm.$q.notify({ position: 'top', color: 'positive', message: 'Whoops! File upload fail.' })
      }
    },

please help me to fix this thank you!

@genyded well im on a test mode thats why i used the same image for all the slides and i dont think that is the reason why i can’t get my expectation, now i tried to use different images but still, i cant display the thumbnail icon button and the thumbnails below the carousel. And even if i bound to true or false , the thumbnails-horizontal still display the same result.

here is my new code

<q-carousel
              color="white"
              arrows
              height="300px"
              :thumbnails="[
                'statics/red-handbag-with-gold-detail_925x.jpg',
                'statics/blank-colored-t-shirts_925x.jpg',
                'statics/sarah_retail_owner_woman_portrait_925x.jpg'
              ]"
              thumbnails-horizontal="true"
              class="q-ma-xs"
            >
            <q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
            <q-carousel-slide img-src="statics/blank-colored-t-shirts_925x.jpg" />
            <q-carousel-slide img-src="statics/sarah_retail_owner_woman_portrait_925x.jpg" />
            </q-carousel>

since you are smarter than me, by any chance do you have a solution or suggestion so i could fix this? thank you!

@genyded well i dont see any reddish errors to my console

Hello friends,

newbie here

i am trying to add some carousel to my project with a thumbnails. So basically i followed the instructions to the documents but fails me to display the thumbnail… can anyone help me? thank you!

here is my code snippet

        <q-card>
          <q-card-media >
<q-carousel
  color="white"
  arrows
  height="300px"
  :thumbnails="[
    'statics/red-handbag-with-gold-detail_925x.jpg',
    'statics/red-handbag-with-gold-detail_925x.jpg',
    'statics/red-handbag-with-gold-detail_925x.jpg',
    'statics/red-handbag-with-gold-detail_925x.jpg',
    'statics/red-handbag-with-gold-detail_925x.jpg',
    'statics/red-handbag-with-gold-detail_925x.jpg'
  ]"
  thumbnails-horizontal
  class="q-ma-md"
>
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
<q-carousel-slide img-src="statics/red-handbag-with-gold-detail_925x.jpg" />
</q-carousel>
          </q-card-media>
          <q-card-main>

          </q-card-main>
        </q-card>

and here is the output:

but my expectation output is:

please help me thank you!

Hi i just want to know if its possible to register my custom components in quasar.conf.js?
because i want to make my custom component use it globally without importing it in every pages thank you!

e.g.

framework: {
      components: []
}, 
customize: {
   components: [
      'SomeComponents'  // in here you can register your custom component
   ]
}

thank you!

@nothingismagick said in CALL_AND_RETRY_LAST:

NODE_OPTIONS=–max_old_space_size=4096 DEBUG=v8:* npm run dev:pwa

@nothingismagick how to set this code to my package.json… sorry im still new to node js

Hi I just want to know what is this fatal error? while compiling my code? it keeps popping out whenever i get syntax error as shown in the screenshot below:

please help me about this thank you!

whoops! i fixed it thank you!

this what i did

<template slot="body" slot-scope="props" :props="props">
          <q-tr :props="props" class="cursor-pointer" @click.native="$router.push({ path: '/user/trips', query: { tripId: props.row._id } })">

Hi i am trying to add some @click event on every table rows of my data table please help me.
here is what i did:

<template slot="body" slot-scope="props" :props="props" class="cursor-pointer" @click.native="alert('test not working')">
          <q-tr :props="props" >
            <q-td auto-width>
              <q-checkbox color="primary" v-model="props.selected" />
            </q-td>
            <q-td key="vehicle" :props="props">
              <q-checkbox color="primary" v-model="props.expand" checked-icon="remove" unchecked-icon="add" class="q-mr-md" />
              {{ props.row.vehicle.plateNumber }}
            </q-td>
            <q-td key="dispatcher" :props="props">{{ props.row.dispatcher.name }}</q-td>
            <q-td key="client" :props="props">{{ props.row.client.name }}</q-td>
            <q-td key="origin" :props="props">{{ props.row.origin.name +' ( '+ props.row.origin.code + ')' }}</q-td>
            <q-td key="destination" :props="props">{{ props.row.destination.name +' ( '+ props.row.destination.code + ')' }}</q-td>
            <q-td key="created_at" :props="props">{{ props.row.created_at }}</q-td>
          </q-tr>
          <q-tr v-show="props.expand" :props="props">
            <q-td colspan="100%">
              <div class="container">
              </div>
            </q-td>
          </q-tr>
        </template>

thank you in advance!