i18n & Quasar: How to bind locale strings to q-item-main label?

  • Hello everyone,

    Quasar & Vue beginner here, this might be a general question, I’ve come across it as I am trying to dynamically bind translated strings to my q-list dropdown menu, respectively the q-item-main label property.

    So this static label “Labeltext”

           <q-item @click="launch('http://quasar-framework.org')">
                    <q-item-main label="Labeltext"/>

    I’d like to replace “Labeltext” with a i18n string that would usually be set up like this (it’s a pluralization):
    {{ $tc(‘menu.menu_2’, 0) }}

    So using this in a <p> tag or anywhere outside a property works fine. I am just not sure how using it in a property.

    I am sure this can be done, hope that someone has an idea.

    Thank you very much in advance and happy coding

  •  <q-item @click="launch('http://quasar-framework.org')">
                    <q-item-main :label="$tc(‘menu.menu_2’, 0)"/>

    Note the : this binds the prop to a function instead of using the string.

  • Thank you once again @a47ae !

  • Always glad when I can help! 🙂

Log in to reply