Как правильно настроить мультиязычность для проекта на NUXT VUE?

Привет делаю проект , Бек у меня на laravel а для фронта впервые попробовал использовать nuxt.
Larvel отдает по api json напимер такой.
{
            "menu_id": 1,
            "menu_item__id": 1,
            "menu_item_title_ru": "Главная",
            "menu_item_title_uk": "Головна",
            "menu_item_path": "/",
            "menu_item_icon": null,
            "menu_item_parent_id": 1,
            "menu_item_status": "1"
        },
        {
            "menu_item_id": 2,
            "menu_item_menu_id": 1,
            "menu_item_title_ru": "Контакты",
            "menu_item_title_uk": "Контакти",
            "menu_item_path": "/contacts",
            "menu_item_icon": null,
            "menu_item_parent_id": 1,
            "menu_item_status": "1"
        },

это как пример))
я для мультиязычности поставил i18n, статичные названия он переводит отлично.
далее возник вопрос как получать нужный вариант из json
Сейчас я решил пока вопрос так. Получаю локаль и в зависимости от нее вывожу нужный язык
<nuxt-link
          :to="item.menu_item_path">
          <span v-if="$i18n.locale === 'ru'">{{item.menu_item_title_ru}}</span>
          <span v-else>{{item.menu_item_title_uk}}</span>
        </nuxt-link>

но чувствую что это еще тот костыль))
Может у кого то есть более правильное решение?
  • Вопрос задан
  • 170 просмотров
Решения вопроса 1
yarkov
@yarkov Куратор тега Vue.js
Помог ответ? Отметь решением.
А если так?
<span>{{item[`menu_item_title_${$i18n.locale}`]}}</span>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы