Используйте i18n в vuejs и blade.php

Question

Я хотел бы использовать i18n в представлениях blade.php и vuejs. Является ли это возможным? Я уже сделал файл json для i18n, он выглядит так:

export default {
    "en": {
        "menu": {
             "home":"Home",
             "example":"Example"
        }
    }
}

Он работает с vuejs, но мне интересно, как использовать его в laravel ... Возможно ли это?

Иначе, есть ли способ получить доступ к cookie как в laravel, так и в vuejs, или мне нужно использовать запрос axios для его сохранения и получить его в vue? (Я хотел бы хранить и читать использовать язык).

Вот представление blade.php, где я хотел бы использовать i18n

@if (Route::has('register'))
      <li class="nav-item">
             <a class="nav-link" href="{{ route('register') }}">{{ __('home.example') }}</a>
      </li>
@endif

В файлах vue.js все, что я делаю, это {{$ t ('home.example')}}}

Я использую эту библиотеку: https://github.com/kazupon/vue-i18n

Большое спасибо!

Answer 1

Я не думаю, что легко использовать vue-i18n в шаблонах Blade.

Шаблоны Blade позволяют использовать символ @ перед фигурными скобками ({{ и }}), чтобы указать, что выражение не должно оцениваться Blade.Я хотел предложить вам использовать это в своих интересах и использовать @ {{ $t('home.example') }} внутри Blade.Я думаю, что Vue-i18n должен был быть внутри вашего установленного элемента Vue, чтобы поднять его.Тем не менее, Vue заменяет смонтированный элемент, начиная с Vue 2.x, так что ваши шаблоны Blade внутри вашего смонтированного элемента Vue могут быть потеряны.

Я думаю, что вам лучше всего использовать генератор дляскопируйте все свои строки перевода Laravel на Vue-i18n. laravel-vue-i18n-generator выглядит как хороший пакет для этого.

По сути, вы затем сохраните свои строки перевода в Laravel и сможете использовать их в Blade как обычно.Каждый раз, когда вы обновляете эти строки, вам нужно будет снова запускать генератор, чтобы они были доступны в Vue-i18n, где вы можете получить к ним обычный доступ с помощью Vue-i18n.