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

Question

我一直在试图弄清楚如何做到这一点，但似乎无法让它发挥作用。我创建了一个函数，当我使用 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 当前是一个字符串，但我不知道如何解决该问题。任何帮助，将不胜感激！

Answer 1

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

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

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

Answer 2

你需要this.data[id]而不是this.data.id.

请参阅MDN 上的属性访问器以供参考。

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