Question

需要通过在customer.vue文件中引用我的locale.js文件来获取值。

以下是代码段：

locale.js

module.exports = {
  de: {
    labels: {
        customer: {
            salutation: 'Anrede',
            firstname: 'Vorname',
            surname: 'Nachname',
            birthdate: 'Geburtsdatum',
            errormessages: {
                required: 'Eingabe erforderlich',
                invalidmailaddress: 'Ungültige Mailadresse',
                mailaddressnotmatched: 'Mailadressen sind unterschiedlich',
                invaliddate: 'Das Datum ist ungültig',
                invalidmobileno: 'ungültige Handynummer'
            }
        }
      }
    }
  }

customer.vue

 export default {
  name: 'customer',
  methods: {
    errorMessage: function (fieldName) {
      if (this.errors[ fieldName ] === required) {
        return this.$i18n.t('messages.errormessages.required')
      } else if (this.errors[ fieldName ] === mailInvalid) {
        return this.$i18n.t('messages.errormessages.invalidmailaddress')
      } else if (this.errors[ fieldName ] === mailNotEqual) {
        return this.$i18n.t('messages.errormessages.mailaddressnotmatched')
      } else if (this.errors[ fieldName ] === dateInvalid) {
        return this.$i18n.t('messages.errormessages.invaliddate')
      } else if (this.errors[ fieldName ] === lengthInvalid) {
        if (!String.format) {
          String.format = function (format) {
            var args = Array.prototype.slice.call(arguments, 1)
            return format.replace(/{(\d+)}/g, function (match, number) {
              return typeof args[number] !== 'undefined'
                ? args[number]
                : match
            })
          }
        }
        return String.format(this.$i18n.t('messages.errormessages.invalidlength'), this.validationLength[fieldName])
      } else if (this.errors[ fieldName ] === mobileNrInvalid) {
        return this.$i18n.t('messages.errormessages.invalidmobileno')
      }
      return ''
    }
  }
}

main.js

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import App from './App'
import VueRouter from 'vue-router'
import VueGtm from 'vue-gtm'
import VueScrollTo from 'vue-scrollto'
import messages from './locale'

Vue.config.productionTip = false

Vue.use(VueRouter)

Vue.use(VueGtm, {
  debug: false // Whether or not display console logs debugs (optional)
})

Vue.use(VueScrollTo)

const router = new VueRouter({
  mode: 'history',
  base: __dirname,
  routes: [
  ]
})

Vue.use(VueI18n)

const i18n = new VueI18n({
  locale: 'de',
  messages
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App },
  i18n
})

我得到的错误是“这个。$ i18n.t（'messages.errormessages.invaliddate'）”这是声明没有提供中提供的数据locale.js 即可。但我可以在模板中使用此值，但在js块中它会失败。

Answer 1

您使用的是kazupon / vue-18n吗？

可能你指的是错误的对象。

尝试使用：

this.$i18n.t('label.customer.errormessages.invaliddate')

如果您在该行上有错误，并忘记为$ i18n添加类型定义

尝试访问以下内容：

this._i18n

使用vue js从vue-i18n文件中获取属性

1 个答案: