Best posts made by digiproduct

As I’ve been learning Quasar, I’ve been watching Danny Connell’s excellent free video training on YouTube.

He’s got a real great teaching style that makes it easy to learn … and he covers things in such detail that it’s easy to get going using his course.

You can watch his full FREE YouTube training course at …

https://www.youtube.com/playlist?list=PLAiDzIdBfy8iu_MZrq3IPuSFcRgCQ0iL0

If you want something more advanced, he’s just released a more detailed course on Udemy, and it’s currently at a special linka for Quasar users at Udemy …

Use this link and 50% of the revenue will go to the Quasar Team: https://dannys.link/quasarf

There’s almost 15 hours of training videos in the course … it’s massive … but, obviously, you can watch them at whatever pace you wish.

How do you get QSelect to display the label instead of the value?

Often you might wish to display the label value of your options in the QSelect rather than the actual value.

For example, if you have a QSelect for salesRegionId but wish to show the descriptive label of that region. eg.
Label: North East
Value: 3

To get this to work in that way, you need to add two settings to your QSelect

emit-value
map-options

Here’s the example code quickly …

        <q-select
          filled
          v-model="salesRegionID"
          :options="options"
          label="Standard"
          emit-value
          map-options
        ></q-select>

and here’s the sample data

      salesRegionID: null,
      options: [
        {
          label: 'North West',
          value: '1'
        },
        {
          label: 'North Central',
          value: '2'
        },
        {
          label: 'North East',
          value: '3'
        },
        {
          label: 'South West',
          value: '4'
        },
        {
          label: 'South Central',
          value: '5',
        },
        {
          label: 'South East',
          value: '6',
        },
      ]

You can find a reference to this in the docs at
https://quasar.dev/vue-components/select#Example--Map-options

And here’s a codepen, showing the above example if you want to try it out
https://codepen.io/david-watson-the-encoder/pen/eqNrZz

Just discovered this old post … it seems like a good idea.

I notice that it was never implemented in index.tmplate.html

Was it considered for inclusion and rejected?

@wcomnisky That will be perfect for an upcoming project I have planned … thanks for doing that … and also thanks to @patryckx for creating the original work that allowed you to do this translation.

@s-molinari said in Adding and accessing new pages:

Also, if you are just beginning with Vue, I’d suggest you take this course.

https://www.udemy.com/vuejs-2-the-complete-guide

It will save you and us a lot of unnecessary questions and answers.

Scott

This course is currently available on Udemy at the knockdown price of just 11.99 … for the next 5 days only.

Just grabbed my copy … it’s a steal.

I already have some experience of Vue … but this will still be a great reference resource for such a steal of a price.

@s-molinari I will probably do so as I develop my usage.

I was just testing a screen that contained several QList components in a grid.

As I reduced the size of the screen, the QLists resized accordingly … but none of the text resized at all … even when I reduced the screen width from about 1600 down to about 600.

Are there no media queries built into the various CSS text classes such as text-h6? I specifically used the Quasar classes thinking that resizing based on media queries would be a built-in … and that it would just work “out of the box”.

Is there some step I’ve missed during my setup? Or, is it expected that we handle this via our own CSS classes?

@patryckx Many thanks for that … I don’t speak any Portugese, but I could figure out most of what you’re doing and Google Translate will help me when I get around to actually implmenting this for myself.

Again … many thanks.

update on this …

at the suggestion of @metalsadman I installed Vue.js Extension Pack by Hari Shekhar …

I feel like I’ve died and gone to heaven …

I LOVE the little line that links the curly brackets at the start and end of the function

The colours work perfectly for me … and I’m colour-blind in the red/green sector … but the default colours from this package work perfectly for me …

Thanks, @metalsadman … great suggestion

@ and I intend it shout about it “from the rooftops” everywhere I go … I’ve already recommended a developer friend to investigate it.

@s-molinari said in Is support for storybook for a quasar-cli app possible?:

And if you are interested in testing, see this: https://github.com/quasarframework/quasar-testing
Scott

That’s something to note for future use. Thanks @s-molinari

@patryckx I joined the Discord group … another new thing to learn how to use.

Seems like I accidentally joined Discord a couple of weeks ago when I was investigating Vuetify and so I now appear to have 2 DigiProduct accounts at Discord!

After finding Quasar last Friday, I’ve completely given up on persuing the option of adding Vuetify … I’m going all-in on Quasar now … seems much better framework

@rstoenescu Left a comment over on Medium.

Hope all Quasar users will do likewise and help @rstoenescu to promote Quasar and help it grow …

@metalsadman Thanks … appreciate the info.

I really must spend some time learning about Github … and how to get the best from it …

@patryckx Saw Razvan’s commit … I’m excited!

And @s-molinari too … many thanks for the excellent contributions here on the forum.

@rstoenescu said in fluid typography - SOLVED:

Giving a hint on what’s to come, since we’re on the subject of design. We are planning to launch a Quasar themes website and also teach people how easy it is to create custom Quasar v1.0 themes.

That’s excellent news … really looking forward to it.

I really love everything that you’re doing with Quasar (hence why I became a Patreon) and I’m highly impressed by what you’ve achieved so far, and the awesome App Extensions that have started appearing … and the responsiveness of the team is simply amazing.

The future looks very bright for Quasar …

I just wish more Quasar users would help support the team … or at least write a nice comment over on your Medium article …

https://medium.com/quasar-framework/why-donations-are-important-2f3f913cfc2e

@patryckx Second Razvan’s request … an App Extension of this would be a great idea.

@rstoenescu I got this course to help me as I got started with Quasar, and it really helped me quickly understand Quasar and be more productive.

@terrybradshaw I’m not doing Electron apps (yet) but for server apps there’s the DotEnv stuff. There’s an App Extension for it … actually 2 … I’ve no personal experience of them, but perhaps that’s what you need to look at …

https://quasar.dev/app-extensions/discover