q-table with reactive i18n translations for columns name

[Castris]

I think I’m doing something wrong. The other day I asked but I did not understand well and did not locate the conversation.
My app uses i18n and it works fine except in the column columns, which are not reactive to the language change.

<template>
...
<q-table
  :title="$t('users.label')"
  :data="filteredUsers"
  :columns="columns"
  table-header-class="bg-light-blue-1"
  row-key="email"
  :rows-per-page-label="$t('users.records')"
>
. . .
<script>
export default {
  name: 'UsersPage',
  components: { ListDomains },
  data () {
    return {
      tab: 'users'      columns: [
        {
          name: 'avatar',
          align: 'center',
          field: row => row.avatar,
          sortable: false
        },
        {
          name: 'email',
          required: true,
          label: this.$t('users.label'),
          align: 'left',
          field: row => row.email,
          format: val => `${val}`,
          sortable: true
        },
        {
          name: 'name',
          label: this.$t('users.name'),
          align: 'left',
          field: row => row.name,
          format: val => `${val}`,
          sortable: true
        },
        {
          name: 'active',
          align: 'center',
          label: this.$t('users.active'),
          field: row => row.active,
          format: val => String(!!val),
          sortable: true
        },
        {
          name: 'show',
          align: 'center',
          sortable: false
        },
        {
          name: 'edit',
          align: 'center',
          sortable: false
        },
        {
          name: 'archive',
          align: 'center',
          sortable: false
        },
        {
          name: 'delete',
          align: 'center',
          sortable: false
        }
      ]
    }
...

With this code translation of columns only occours when enter in app with any language. But not after.

[chyde90]

Making columns a computed property should do the trick

[Castris]

Thanks… Work fine after create a computed propìerty for columns

columnsI18n () {
      let columns = [
        {
          name: 'domain',
          required: true,
          label: this.$t('domains.label'),
          align: 'left',
          field: row => row.domain,
          format: val => `${val}`,
          sortable: true
        },
        {
          name: 'active',
          align: 'center',
          label: this.$t('domains.active'),
          field: row => row.active,
          format: val => String(!!val),
          sortable: true
        },
        {
          name: 'show',
          align: 'center',
          sortable: false
        },
        {
          name: 'edit',
          align: 'center',
          sortable: false
        },
        {
          name: 'archive',
          align: 'center',
          sortable: false
        },
        {
          name: 'delete',
          align: 'center',
          sortable: false
        }
      ]
      return columns
    }