使用数组值作为另一个的关键

时间:2018-01-20 17:18:48

标签: javascript vue.js vuejs2 vuetify.js

我坚持从数组中读取。有一个源数组:

tnails: [
    {
      mil: '/static/mini/t-icon-mil.png',
      mar: '/static/mini/t-icon-mar.png',
      brd: '/static/mini/t-icon-brd.png',
      prs: '/static/mini/t-icon-prs.png',
      pol: '/static/mini/t-icon-pol.png',
      fbr: '/static/mini/t-icon-fbr.png'
    }
  ],

另一个:

this.headers = [
        {
          mil: 'Entry No. 1',
          mar: 'Entry No. 2',
          brd: 'Entry No. 3',
          prs: 'Entry No. 4',
          pol: 'Entry No. 5',
          fbr: 'Entry No. 6'
        }
      ]

我正在尝试使用部分headers数组条目作为键来显示tnails数组中的值:

tn.substring(20, 23)

它提供了我打算使用的milmar等值。

现在以这种方式格式化:

      <v-layout v-for="t in tnails" :key="t.id">
        <v-flex v-for="tn in t" :key="tn.id">
          <v-tooltip>
            <img :src="tn" slot="activator">
            <span>{{ headers (???) tn.substring(20, 23) }}</span>
          </v-tooltip>
        </v-flex>
      </v-layout>

如何组合这两个数组中的数据以显示headers的条目?

1 个答案:

答案 0 :(得分:1)

您可以使用括号表示法使用解析后的字符串作为键来引用headers对象的属性

headers[index][tn.substring(20, 23)]