panter / vue-i18next

Internationalization for vue using the i18next i18n ecosystem.
https://panter.github.io/vue-i18next/
176 stars 47 forks source link

Support Arrays[] #170

Open buglist3r opened 3 years ago

buglist3r commented 3 years ago

Is there any possibilities to support arrays for example i need to use something like that

 headers: [
   {value: 'due', label: 'Fälligkeit'},
   {value: 'name', label: 'Name'},
 ]

Then i can simply loop through it which is default case with Vue i18n

<div v-for="header in $t('headers')">
   <div> {{ header.value }} </div>
    <div> {{ header.name }} </div>
</div>

Thank you

LG Adel

afv commented 2 years ago

You need the returnObjects option.

JSON:

{
  "headers": [
    {
      "value": "due",
      "label": "Fälligkeit"
    },
    {
      "value": "name",
      "label": "Name"
    }
  ]
}

Template:

<div
  v-for="(header, index) in $t('headers', { returnObjects: true })"
  :key="`header-${index}`"
>
  {{ header.value }} - {{ header.label }}
</div>

Output:

due - Fälligkeit
name - Name