Question

我可以在组件中使用$t：

:label="$t('sign-up.terms-label')"

和在javascript中

 case 'email':
   this.errors.push(this.$t('sign-up.email-exists')); break;

但是我不能在扩展中使用它：

import { extend, localize, ValidationObserver } from 'vee-validate';
localize({
  cs: {
   names: {
     email: $t('sign-up.email-label'),

EsLint表示该函数未定义。

我要本地化vee-validate的字段名称，如下所述：

https://logaretm.github.io/vee-validate/guide/localization.html#using-the-default-i18n

I18N是这样定义的：

Vue.use(VueI18n);

export default new VueI18n({
  locale: process.env.VUE_APP_I18N_LOCALE || 'cs',
  fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'cs',
  messages: loadLocaleMessages(),
});

Answer 1

发生错误，因为未在此范围内定义$t。

正如the guide所示，$t应该被称为Vue组件之外的vue-i18n实例上的方法。

如果是在另一个模块中定义的，则应从导出了vue-i18n实例的模块中导入：

import i18n from './i18n';

...

localize({
  cs: {
   names: {
     email: i18n.$t('sign-up.email-label'),
     ...

Answer 2

您可以从created()方法中调用extend，此时您将可以访问this.$t。

created() {
  localize({
    cs: {
     names: {
       email: this.$t('sign-up.email-label'),
  //...
}

Vue L18N $ T未定义

2 个答案: