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
    1. Home
    2. Help
    Log in to post
    • Newest to Oldest
    • Oldest to Newest
    • Most Posts
    • Most Votes
    • mesqueeb

      Trying to install Google Analytics. Very confused!
      • mesqueeb

      16
      0
      Votes
      16
      Posts
      3613
      Views

      C

      I’m also trying to get Google Analytics to work. Followed the tutorials in the links in this thread and when I try to add the file to the plugin section of the quasar.conf file I get an error. :(. Anyone have a fully complete tutorial that works?

    • M

      How to marking CSS files as exceptions in RTL
      • mili1374

      3
      0
      Votes
      3
      Posts
      244
      Views

      M

      i have the same problem .

    • W

      How to list tags followed by a "new tag" entry?
      • wpq

      6
      0
      Votes
      6
      Posts
      873
      Views

      I

      @wpq said in How to list tags followed by a "new tag" entry?:

      Should someone stumble upon the same issue, this is how I finally did it using purely the framework:

      <div> <q-input v-model="newTag" label="New..."> <template v-slot:before> <q-chip removable @remove="deleteTag(tag)" v-for="tag in displayedNote.tags"> {{tag}} </q-chip> </template> </q-input> </div>

      I did some changes to achieve my goal.

      <q-input v-model="newTag" outlined @keyup.enter="addTag" dense> <template v-slot:prepend> <q-chip removable @remove="form.tags.splice(key, 1)" v-for="(tag, key) in form.tags" :key="key"> {{tag}} </q-chip> </template> </q-input>
    • T

      How to select text on focus in a QInput
      • turigeza

      10
      0
      Votes
      10
      Posts
      3953
      Views

      C

      @jubalj said in How to select text on focus in a QInput:

      Posting for someone else looking for a simpler solution as I found a solution;

      Add the following to inside the <q-input>

      @focus="(input) => input.target.select()"

      Found it at https://github.com/quasarframework/quasar/issues/8402

      Thanks for this! I’m looking for the same thing. However when I apply your solution to my q-input I get this error:
      Uncaught TypeError: input.target.select is not a function

      I’m still pretty darn new to Quasar, is there something I’m missing when I add this?

      hmm playing around, it looks like this doesn’t work on a number field. Dangit. Any solutions for a number field?
      I have mask="##" included.

    • E

      How to trigger the dialog onOk button ( jest unit test )
      • endielo

      3
      1
      Votes
      3
      Posts
      960
      Views

      B

      Hey guys, stumbled upon that issue today. This is how I managed to do it.
      Suppose you call the dialog like this in you vue

      // draft.vue this.$q.dialog({ title: this.$t('mixin.delete.title'), message: this.$t('mixin.delete.confirmation'), cancel: true, persistent: true }).onOk(() => { this.deleteDraftLifts() })

      You can trigger the onOk callback in two times by using the mockReturnThis() function of jest. The trick is to understand that we are tying to mock chained functions (this.$q.dialog({...}).onOk())

      So start by mocking this.$q.dialog({...}) with

      // draft.spec.js vm.$q.dialog = jest.fn().mockReturnThis()

      then mock the onOK like this

      // draft.spec.js vm.$q.dialog().onOk = jest.fn()

      now you can trigger your function and it will pass.

      // draft.spec.js wrapper.find('xxxx-class' ).trigger('click') expect(vm.$q.dialog().onOk).toHaveBeenCalled()

      You can go further by checking the delete logic inside if you want. You will need to abstract the logic inside a function like I did in my example draft.vue withthis.deleteDraftLifts()
      by doing this you can now write the following code

      // draft.spec.js vm.$q.dialog = jest.fn().mockReturnThis() vm.$q.dialog().onOk = jest.fn(() => vm.deleteDraftLifts()) wrapper.find('xxxx-class' ).trigger('click') expect(vm.$q.dialog().onOk).toHaveBeenCalled()
    • S

      Quasar can't access environment variables in Docker container.
      • Shard

      3
      0
      Votes
      3
      Posts
      630
      Views

      arieltoledo

      Same issue did you manage to resolve this ?

    • D

      Increase Label Size/Weight for Fields & Inputs??
      • daveline

      7
      0
      Votes
      7
      Posts
      2188
      Views

      D

      One way could be to use label slots in quasar v2.1.1

    • V

      Quasar ChatMessage - Add icon with action
      • vinnyc

      4
      0
      Votes
      4
      Posts
      1927
      Views

      R

      Hi, I think this is a normal issue across the development of bots.
      You will have to avoid creating new slots and integrate the code in the existing slots. But the code by default creates a new slot I guess. If that is the issue you could try out the code below:
      <!–
      Forked from:
      https://quasar.dev/vue-components/chat#Example--Default-slot
      –>
      <div id=“q-app”>
      <div class=“q-pa-md row justify-center”>
      <div style=“width: 100%; max-width: 400px”>
      <q-chat-message
      v-for="(msg,i) in messages"
      :name=“msg.name”
      :avatar=“msg.avatar”
      :stamp=“msg.stamp”
      :sent=“msg.status === ‘sent’”
      :bg-color=“msg.bgColor”
      :text-color=“msg.textColor”
      :key=“i”
      >
      <template v-for="(text, j) in msg.text" :key=“j”>
      {{text}} 
      <q-icon :name=“msg.action.icon” @click=“someAction(msg.action.name)” :color=“msg.action.color”></q-icon>
      <br v-if=“text.length > j”>
      <q-markdown>

      {{text}}

      This is a Blockquote
      with a token and a link

      Blockquotes can also be nested…

      …by using additional greater-than signs right next to each other…

      …or with spaces between arrows.
      </q-markdown>
      </template>
      </q-chat-message>
      </div>
      </div>
      </div>
      This is just for Quasar chatmessage option and not for other platforms. If you are interested in other platforms it would be better if you take help from any chatbot development services as they might provide you a quik and simple solution. Also this stage is quite simple and further integrating complex cognitive functionalities could be quite challenging.

    • J

      Expansion Items: Only Open One Item at a Time
      • Julia

      6
      0
      Votes
      6
      Posts
      786
      Views

      PeterQF

      Anyone know if this is possible to do in table expansion?

      Found solution here: https://codepen.io/pdanpdan/pen/eYmwryW?editors=1010

    • H

      Style tag in meta plugin supported?
      • hexillion

      5
      0
      Votes
      5
      Posts
      352
      Views

      G

      Have you fixed that @hexillion ? Got that issue too.

    • alhidalgodev

      Use firebase-messaging-sw.js file in quasar 1.5.8
      • alhidalgodev

      14
      0
      Votes
      14
      Posts
      2047
      Views

      N

      @jrhopkins83 Hi, I have the same problem. Did you solve? Thanks.

    • A

      How do i add global filters to Quasar?
      • Abdullah Sohail

      7
      0
      Votes
      7
      Posts
      2468
      Views

      gvorster

      @abdullah-sohail said in How do i add global filters to Quasar?:

      I cant seem to figure out how to add filters globally . Should i make a folder for global filters and then export the filter file but where do i refer it there isn’t any option for filters in quasar.config.js.

      I am using Quasar 2.0.3 and a global filter can be setup like described here: https://v3.vuejs.org/guide/migration/filters.html#global-filters

      I needed a global dateFormat filter and this example works for me:

      boot file:

      import { boot } from 'quasar/wrappers' export default boot(async ( { app } ) => { app.config.globalProperties.$filters = { dateFormat(value) { return 'date filter: ' + value } } })

      template:

      <template> <q-page padding> {{$filters.dateFormat("hello")}} </q-page> </template>

      Output:

      date filter: hello
    • S

      QSelect not updating when default value is set
      • smaldona

      6
      0
      Votes
      6
      Posts
      5884
      Views

      J

      @smaldona this solved my problem, thanks. Also this is weird the way it has to be done like this.

    • E

      Unsafe return of an any typed value
      • Eaglorn

      5
      0
      Votes
      5
      Posts
      6346
      Views

      dobbel

      @michael123

      Hi, this forum is dead. Please ask your questions on the Quasar github discussions forum instead.

      https://github.com/quasarframework/quasar/discussions

    • R

      Vertical toggles?
      • rconstantine

      4
      0
      Votes
      4
      Posts
      404
      Views

      M

      I landed on this thread when I was looking for the same thing and am adding my response in case it helps someone else. I am currently using Quasar 2 (this may work in 1 also).

      I added the following style to achieve the vertical orientation: flex-direction:column;

    • B

      Trouble Accessing Data from Boot File
      • bdaviddee

      12
      0
      Votes
      12
      Posts
      2853
      Views

      V

      Worked great! Thank you

    • J

      CALL_AND_RETRY_LAST
      • jeimz173

      20
      0
      Votes
      20
      Posts
      2332
      Views

      S

      @cd said in CALL_AND_RETRY_LAST:

      Hope this is helpful for others.

      Very much so, I have already lost a workday before my deadline while searching for a solution. Thank you!

    • Q

      How to update auth token using app-extension-apollo each time a user log in?
      • QuaDgf

      3
      0
      Votes
      3
      Posts
      807
      Views

      G

      Can you share the full implementation here. Plz

    • P

      Carousel with more visible slides at once
      • PSTA

      6
      1
      Votes
      6
      Posts
      1252
      Views

      bekki

      Yes please add this kind of opportunity

    • A

      How to go to an external site when clicking on a drawer link item
      • april

      14
      0
      Votes
      14
      Posts
      10064
      Views

      E

      It seems like <q-btn type="a" href="https://www.google.com">Go to Google</q-btn> works. 🙂 I gut the hint from the Open-External-URL's documentation.