我可以使用动态值来访问 Vue.js 中的特定数组吗？答案

【问题标题】：Can I use a dynamic value to access a specific array in Vue.js?我可以使用动态值来访问 Vue.js 中的特定数组吗？
【发布时间】：2021-09-09 20:29:51
【问题描述】：

我一直试图弄清楚如何做到这一点，但似乎无法让它发挥作用。我创建了一个函数，当我使用 v-on:click 单击组件时会调用该函数。我还尝试传入一个值，然后我可以使用该值来访问来自后端的数据形式的特定数组。

这是组件中的函数：

<v-card
  @click="getContent('topSellers')"
 >

然后，我将“topSellers”值作为“id”传递给用于访问我正在寻找的确切数组的函数：

getContent(id) {
      this.accordion = this.data.id;
      console.log("data", id);
    }

首先，this.data.topSellers 有效。而且我看到控制台中的 id 值是正确的。显然，这不起作用，因为 id 当前是一个字符串，但我不知道如何解决该问题。任何帮助将不胜感激！

【问题讨论】：

你能把整个代码贴出来吗？这是模棱两可的
this.accordion = this.data[id] 绝对基础知识...

标签： javascript arrays vue.js dynamic-values

【解决方案1】：

您需要this.data[id] 而不是this.data.id。

参考property accessors on MDN。

data[id] 将使用id 的值的名称访问data 的属性，在您的情况下为topSellers。所以data.topSellers 等价于data["topSellers"]

【讨论】：

谢谢！非常感谢您的帮助。

【解决方案2】：

[] 允许您使用变量访问对象。

建议处理异常，因为收到的变量不安全。

getContent(id) {
  const accordion = this.data[id] || null;
  if(accordion){
    console.log("data", accordion);
    this.accordion = accordion;
  }
}

【讨论】：