如何使用 vuejs 翻译选择选项

Posted 2023-02-16

【中文标题】如何使用 vuejs 翻译选择选项

【英文标题】：How translate select options with vuejs

【发布时间】：2022-01-18 20:49:03

【问题描述】：

我想翻译在 contract_project_type 数组中找到的选项，

这是我的选择代码：

<b-form-select
              :options="contract_project_types"
              v-model="form.contract_data.contract_project_type"
              id="contract_project_types"
              :state="validate(form.contract_data.contract_project_type)"

          ></b-form-select>

我的数据是：

data: 
contract_project_types: [
      'digital_work_city',
      'general_company'
      ]

我不知道如何翻译这两个选项。 我试过把this.$t('digital_work_city')this.$t('general_company')放，但它不起作用

【参考方案1】：

在模板之外尝试从this 上下文中获取$t。

data() 
    return  contract_project_types: [
      this.$t('digital_work_city'),
      this.$t('general_company')
      ]
    

你也可以试试

this.$i18n.t('digital_work_city')

【讨论】：

我试过了，还是不行

您使用什么库进行翻译？我为解决方案添加了另一个选项

I18n Ruby on rails

【参考方案2】：

试试这个。可能是，它没有对更改语言做出反应。

computed: 
    contract_project_types() 
         return [
           this.$t('digital_work_city'),
           this.$t('general_company')
      ];