I have a file with constants like this:
import i18n from '@/i18n';
export const FILTERS = {
BALCONY_TYPE: [
{
value: 0,
name: i18n.t('home.filters.type.balcony_type.0')
},
{
value: 1,
name: i18n.t('home.filters.type.balcony_type.1')
}
],
}
In my component I have:
<label class="uk-form-label search-label">Balcon</label>
<switcher-filter
:type="apartmentsFilterType.BALCONY_TYPE"
:options="balconyType"
@updateFilter="updateFilterValue"
:selected-option="selectedValue(apartmentsFilterType.BALCONY_TYPE)"
:key="$store.getters['language/getCurrentLanguage']"
>
</switcher-filter>
export default {
name: "Bloc",
components: {
SliderFilter,
SelectFilter,
InputNumberFilter,
SwitcherFilter,
Country,
Region,
City
},
data() {
return {
balconyType: FILTERS.BALCONY_TYPE
SwitcherFilter:
<template>
<div>
<ul class="uk-subnav uk-subnav-pill">
<li
v-for="item in options"
:class="item.value === selectedOption ? 'uk-active' : ''"
>
<a
href="#"
v-on:click="onChange(item.value)"
>
{{ item.name }}
</a>
</li>
</ul>
</div>
</template>
export default {
name: "SwitcherFilter",
props: ["options", "type", "selectedOption"],
methods: {
onChange(value) {
this.$emit('updateFilter', this.type, value);
}
}
}
When I change language, BALCONY_TYPE values are not translated. Can you help me please?
I save my language in Vuex.