Переведите текст из скрипта с помощью Vue-i18n - PullRequest
Новая
       31

Переведите текст из скрипта с помощью Vue-i18n

0 голосов
/ 08 апреля 2019

Я установил плагин vue-i18n и выполнил шаги, упомянутые в этом руководстве .Теперь у меня есть все заменяемые теги с английского на все языки, на которых у меня есть файлы локализации.Моя проблема в том, что я хочу переводить сообщения, которые приходят из части JavaScript, например, тексты об ошибках или всплывающие уведомления ... и т.д.

Например, у меня есть заполнители в моих полях, иЯ хотел перевести их, поэтому мой шаблон выглядит следующим образом: 

<b-form-input
        id="password"
        v-model="passwords.currentPassword"
        :placeholder="placeholders.currentPassword"
        type="password"
      />

в скрипте я установил текст следующим образом 

data() {
return {
  placeholders: {
    //currentPassword: "Enter your current password",
    currentPassword: this.$t("changePassword.newPasswordPlaceholder"),
    newPassword: "Enter your new password",
    confirmPassword: "Confirm your new Password"
  }

Я пробовал это решение, но текст я получаю вполе: changePassword.newPasswordPlaceholder

Я пытался вызвать i18n как компонент, но мне не удалось ... Есть ли способ установить значения переменных вне шаблона (html)?

1 Ответ

1 голос
/ 08 апреля 2019 
currentPassword: this.$t("changePassword.newPasswordPlaceholder")

Этот код ищет файл локализации для текущего языка. Там сначала ищем значение json с ключом changePassword. Если он найдет, он будет искать ключ newPasswordPlaceholder, затем, если он найдет его, он также вернет его значение. Эти значения должны быть введены внутри всех файлов локализации. Вы должны добавить эти строки в файл json, как показано ниже, чтобы работать так, как вы хотите: 

//json file where all localisation key : value pairs stored

"changePassword": {
    "newPasswordPlaceholder" : "text of password placeholder"
}

После определения этих значений вы можете использовать перевод, как описано в вашем примере. Также нет необходимости звонить с объекта как в вашем коде :placeholder="placeholders.currentPassword". Вы можете использовать i18n напрямую. 

:placeholder="$t('changePassword.newPasswordPlaceholder')"
...