@pazarbasifatih This is what I did…
Installed the @growthbunker/vueflags
package
quasar new boot flags
- created a new boot file:
import Vue from 'vue'
import VueFlags from '@growthbunker/vueflags'
Vue.use(VueFlags, {
iconPath: '/flags'
})
Make sure you add the boot file to quasar.conf.js
boot array.
Created a new folder in /public
called flags
(created public if it doesn’t already exist, same level as src
)
From the Vueflags web site, downloaded the flags I wanted e.g gb.svg
, es.svg
, fr.svg
and put them in public/flags
You can then use <gb-flag code="es" size="mini" />
in your components. I wrapped it up into a Language Switcher component, e.g:
which uses this.$i18n.local
to determine what flag to display in the q-btn-dropdown
label slot.