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

    [Solved] [V1] How to support i18n with internal validation

    Framework
    2
    6
    253
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S
      Stanley last edited by Stanley

      Dear Quasar team,

      After reading forum https://forum.quasar-framework.org/topic/4087/reuse-of-validation-rules, I think it is very practical to use internal validation.
      But how to support with I18n? see below code.

      const emailPattern = /^(?=[a-zA-Z0-9@._%+-]{6,254}$)[a-zA-Z0-9._%+-]{1,64}@(?:[a-zA-Z0-9-]{1,63}\.){1,8}[a-zA-Z]{2,63}$/;
      
      export const email = val => emailPattern.test(val) || this.$i18n.t('xx');  // only available in vue instance
      export const required = val => !!val || this.$i18n.t('yy'); // only available in vue instance
      

      So how to support it in js file? Because i18n.js (as plugin) is under folder “boot”, I am not sure how to refer it.

      1 Reply Last reply Reply Quote 0
      • metalsadman
        metalsadman last edited by metalsadman

        @Stanley either you expose an instance of it from your boot file and import it in your js file or just import Vue, then Vue.$i18n.t(...).

        S 1 Reply Last reply Reply Quote 0
        • S
          Stanley @metalsadman last edited by Stanley

          @metalsadman said in [V1] How to support i18n with internal validation:

          Vue.prototype.$i18n.t

          I would like to pick the latter one and use below syntax

          import Vue from 'vue'
          export const checkEmail = val => emailPattern.test(val) || console.log(Vue.prototype.$i18n)
          

          the output console is: undefined
          Could you please check it?

          metalsadman 1 Reply Last reply Reply Quote 0
          • metalsadman
            metalsadman @Stanley last edited by

            @Stanley try remove prototype word.

            S 1 Reply Last reply Reply Quote 0
            • S
              Stanley @metalsadman last edited by Stanley

              @metalsadman Finally, I can use below way to implment it.

              import { i18n } from 'boot/i18n.js'
              export const requiredxx = val => !!val || i18n.t('xxx')
              

              Because the boot/i18n.js file is defined as below

              import Vue from 'vue'
              import VueI18n from 'vue-i18n'
              import messages from 'src/i18n'
              
              Vue.use(VueI18n)
              
              const i18n = new VueI18n({
                locale: 'en-us',
                fallbackLocale: 'en-us',
                messages
              })
              
              export default ({ app }) => {
                // Set i18n instance on app
                app.i18n = i18n
              }
              
              export { i18n }
              
              1 Reply Last reply Reply Quote 0
              • metalsadman
                metalsadman last edited by

                yeah that’s what i said on my first post xD. gz.

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post