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

[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.

[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(...).

[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]

@Stanley try remove prototype word.

[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 }

[metalsadman]

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