在nuxt.js插件中调用$ t函数

Question

我正在构建nuxt.js应用程序。所以我的计划是注入被重用到上下文中的帮助对象和函数。

所以我创建了一个插件

export default (context) => {
     const { $t } = context.app;

     const validators = {
      firstNameRules: [
         v => !!v || $t('formValidation.NO_FIRST_NAME'),
         v => v.length < 128 || $t('formValidation.INVALID_FIRST_NAME_TOO_LONG')
       ]
     };

     context.$formValidators = validators;
}

该对象已正确注入上下文，我可以在所需的位置访问规则。 但是尝试运行$ t函数会使我出错

Cannot read property '_t' of undefined 

所以基本上，我想运行$ t函数并在发生事情时获取本地化消息。这可能吗？如果可以，怎么办？

Answer 1

所以我设法最终解决了它。

这就是Vehicle BMW = new Car(); 在JS中的表现方式

我将代码更改为这样：

this

然后从我的组件/页面

export default function(context) {
  function getValidators() {
    return {
      firstNameRules: [
        v => !!v || this.$t('formValidation.NO_FIRST_NAME'),
        v => v.length < 128 || this.$t('formValidation.INVALID_FIRST_NAME_TOO_LONG')
      ]
    };
  }

  Vue.prototype.$formValidators = getValidators;
  context.$formValidators = getValidators;
}

这样做，data() { const { firstNameRules } = this.$formValidators(); } 一直保留到this函数

Answer 2

尝试使用inject：

export default (context, inject) => {
  const { $t } = context.app;
  const validators = {
    firstNameRules: [
      v => !!v || $t('formValidation.NO_FIRST_NAME'),
      v => v.length < 128 || $t('formValidation.INVALID_FIRST_NAME_TOO_LONG')
    ]
  };

  context.$formValidators = validators;
  inject('formValidators', validators);
};