Hello guys,i need your help on how to use quasar components in Vue.extend… i tried to import some quasar component but it fails me…

i have this sample.js where as you can see here, i imported the QDatetime component

import Vue from 'vue/dist/vue.js'

import { QDatetime } from 'quasar'  
export default Vue.extend({
  name: 'DatePicker',
  template: `
  <div>
    <q-datetime v-model="date" />
  </div>
  `,
  components: {
    'q-datetime': QDatetime
  },
  data () {
    return {
      date: ''
    }
  },
  methods: {
    setDate (context) {
      this.date = context
    },
    getValue () {
      return this.date
    }
  }
})

but in my Console it returns this warning: where i have no control to the QDatetime to fix this… please help me thank you…

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: "value"

Hi @s-molinari see this example

https://www.ag-grid.com/example.php#/

as you can see to that example if you move your arrow you can highlight and edit the cell and i want to do that in Qtable…

Hi, Guys i need your help how to highlight cell upon moving the arroa is that possible

hi i am having a problem with arrows on desktop display… here in qtabs please help i just copied the script at docs but its not working thank you! i tried to add multiple tab items but still not displaying the arrows

can anyone of you comment a code snippet please thank you so much!

Hi i am having a problem here with quasar cli… whenever it reach 100 percent no page has been loaded… please help me how to fix this thank you… i already upgrade my quasar cli to the latest version… thanks

when we can download this scroll area horizontal update?.. im excited!

Hi i am having a problem using quasar select i tried to put @change method but its not working what should i do? please help me thank you! but in @input its working… is this still an issue? or something?

  <q-select v-model="sale.product" float-label="Select Product" :options="productOptions" @change="setSelectedProductInfo()"/>

methods () {
setSelectedProductInfo() {
      console.log('triggered')
      let vm = this
      var product = _.find(vm.products, ['_id', vm.sale.product])

      vm.selectedProduct = product
    },

...

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!