laravel - vue-i18n 输出用作类星体数据表标题值

Question

vue-i18n 与 quasar-framework 在 vue 中结合的两种方式

我需要知道，如何放置$t('message.hello')函数， v-html 中实际是什么或双括号 {{ $t('message.hello')在一个变量中。 我试图返回 computed: 中的函数-，和mounted()例如，我还尝试将其放入 window.var 中。

另一种变体

反过来，我需要输入 vue将变量渲染到 $t('message.hello', {scope: 'world'})像这样的方法:$t('message.hello', {scope: 'returned.fromDataOrSomewhere'})

为什么我需要这个

1. 我必须从 promise 注入(inject)一些数据在 vue-i18n翻译动态值。

2. 我需要将翻译后的值放入 Quasar 中<q-datatable>哪些列配置如下:

   {
     label: 'ID', //here I need a variable instead of string
     field: 'id',
     filter: true,
     sort: true,
     type: 'number',
     width: '10%'
   },
   {
     label: 'Username', //here too - and so on...
     field: 'username',
     filter: true,
     sort: true,
     type: 'date',
     width: '20%'
   },
   

   
   
   

编辑:

第二个案例已解决。

Answer 1

如果您想要真正的 react 性，则需要使用计算属性将 v-bind:columns 传递给 q-table 组件。如果使用数据则不具有反应性。

<q-table
  ...
  :columns="columnsI18n"
  ... 

<script>
. . .
computed: {
    columnsI18n () {
      let columns = [
        {
          name: 'username',
          required: true,
          label: this.$t('mailboxes.label'),  // Translation
          align: 'left',
          field: row => row.domain,
          format: val => `${val}`,
          sortable: true
        },
        {
          name: 'active',
          align: 'center',
          label: this.$t('domains.active'), // Translation
          field: row => row.active,
          format: val => String(!!val),
          sortable: true
        }
      ]
      return columns
    },