Блог

Мне нужно немедленное обновление при смене языка на i18n в select

HTML

 <base-dropdown-item
        v-for="(f, i) in filters"
        :key="`dropdown-${i}`"
        @click="filter = f"
        >{{ f.label }}</base-dropdown-item
 

typescript

 data() {
return {
  q: '',
  filter: { label: this.$t('myTasks.filter.Incomplete'), value: 2 },
  filters: [
    { label: this.$t('myTasks.filter.Incomplete'), value: 2 },
    { label: this.$t('myTasks.filter.done'), value: 3 },
    { label: this.$t('myTasks.filter.all'), value: 1 }
  ],

  qTasks: []
};
},
watch: {
'filter.value'() {
  this.$emit('filter', this.filter);
},
};
 

Мне нужно менять язык в режиме реального времени
, когда мне нужно обновить

Язык не изменится, потому что вы определяете метки внутри данных. Попробуйте переместить его в вычисляемое свойство.

 
    computed: {
      filters() {
        return [
          { label: this.$t('myTasks.filter.Incomplete'), value: 2 },
          { label: this.$t('myTasks.filter.done'), value: 3 },
          { label: this.$t('myTasks.filter.all'), value: 1 }
        ];
      },
    },

 

Как только вы переместите его в вычисляемый реквизит, значение меток должно измениться в соответствии с языком

Похоже, вы не меняете языковой стандарт в примере.

Возможно, документация поможет вам. Я не уверен, правильно ли вы настроили языковые сообщения. Вы можете использовать $i18n.locale для изменения локали локально внутри компонента или $root.$i18n.locale для изменения ее глобально в вашем приложении.