Динамическая локализация в vue-i18n

Question

Я хотел бы динамически обновлять свои сообщения о локализации в vue-i18n.

Я создаю интернет-магазин, где каждый предмет имеет описания на нескольких языках. Итак, чего я хотел бы добиться, так это когда я получаю элементы интернет-магазина из REST API, я хочу поместить их имена, описания и т. Д. В объект сообщений в vue-i18n, чтобы он мог работать с ними. Есть ли в API-интерфейсе vue-i18n что-то для этого? Кроме того, я получаю данные с сервера (я получаю обещание), так как я могу убедиться, что они обновляются в представлении браузера, когда я наконец получу ответ, и добавить данные в локализацию?

Answer 1

Я написал миксины и использовал их везде, где мне нужна динамическая локализация:

export default {
  methods: {
    $t: function (translate) {
      if (typeof translate === 'string') {
        return this.$i18n.t(translate)
      } else if (translate === void 0) {
        return this.$i18n.t('loading')
      }
      return translate[this.$i18n.locale]
    }
  }
}

Таким образом, когда мои тексты выглядят следующим образом, я могу позвонить $t(text) (НЕ $t('text') конечно):

data: function () {
   return {text: {en:'Book', de:'Buch', hu:'Könyv'}}
}

Так что в ваших компонентах вы должны импортировать это и добавить его как миксин:

import dynamicLocalization from '@/components/mixins/dynamic-localization'

export default {
   ...
   mixins:[dynamicLocalization]
   ...
}