Vue -i18n: как сохранить выбранную локаль и добавить нужный флаг - PullRequest
Новая
       16

Vue -i18n: как сохранить выбранную локаль и добавить нужный флаг

0 голосов
/ 06 февраля 2020

На vue есть сайт, к которому подключена библиотека i18n. Есть кнопка для переключения языков. 

<div class="locale-changer">
    <v-menu  v-model="changeLocaleState" offset-y>
      <template v-slot:activator="{ on }">
        <v-btn
          color="primary"
          dark
          v-on="on"
        />
      </template>
      <v-list>
        <v-list-tile
          v-for="(lang, i) in langs"
          :key="`lang.lacale${i}`"
          :value="lang.locale"
          @click="$i18n.locale = lang.locale"
        >
          <v-list-tile-title><img :src="lang.img">{{ lang.locale }}</v-list-tile-title>
        </v-list-tile>
      </v-list>
    </v-menu>



 export default {
  name: 'VeLanguageSwitcher',
  data () {
    return { langs: [
      {
        name: 'en',
        locale: 'en-US',
        img: '/assets/img/flag/GB.png'
      },
      {
        name: 'ru',
        locale: 'ru-RU',
        img: '/assets/img/flag/RU.png'
      }
    ] }
  },
  computed: {
    changeLocaleState: {
      get () {
        return this.$store.state.ui.changeLocale
      },
      set (val) {
        this.$store.commit('ui/setChangeLocale', val)
      }
    }
  }
}
</script>

Выбранный языковой стандарт не сохраняется. Теоретически я понимаю, что при выборе язык вы делаете SET в Vuex, а GET отображает изображение текущей локали внутри кнопки. Но я не знаю, как это сделать

...