使用数组值作为另一个键答案

【问题标题】：Using Array Value as a Key in Another One使用数组值作为另一个键
【发布时间】：2018-01-20 17:18:47
【问题描述】：

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

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'
        }
      ]

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

tn.substring(20, 23)

它给出了我打算使用的 mil、mar 等值。

现在是这样格式化的：

      <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 的条目？

【问题讨论】：

是tn tnails？ headers[tn.substring(20, 23)]?
是的，这里有说明：v-for="t in tnails"。
@guest271314: headers[0][tn.substring(20, 23)]（注意 0 索引）有效。请将其发布为答案并谢谢！
我认为除了使用 tn.substring(20, 23) 你也可以使用 tnails objects 键。

标签： javascript vue.js vuejs2 vuetify.js

【解决方案1】：

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

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

【讨论】：