Javascript 如何在vue.js中获取引用数组？

在vue中，我使用4个选项卡内容容器创建了4个选项卡（其中4个）。我想在它们上设置一个ref，然后将其作为4的数组。这是密码

它记录数组

{childTabsContent:Array（1）}

当我期待

{childTabsContent:Array（4）}

有人知道怎么了吗

注意：本例使用vuetify 2.0，但该部分与此无关

---

谢谢

只会出现一个“ref”，因为其他的还没有渲染

你可以在这里看到更多细节。

---

单击其他选项卡后，其他“引用”将加载到显示4个元素数组的对象中。

仅呈现活动选项卡项的内容。所以裁判在其他分区上是不存在的

应将参照添加到循环构件中

<v-tab-item v-for="i in 4" :key="i" :ref="'childTabsContent' + i">
  <div v-text="'A' + i"></div>
</v-tab-item>

---

如果它们应该是唯一的，为什么它要返回长度为1的数组，而不仅仅是元素本身？问题可能是由

组件如何呈现其项引起的；您正在渲染4个

组件，但是

组件可能只渲染第一个组件？

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  mounted : function() {
    var vm = this;
    setInterval(function() {
          var tabs = vm.$refs;
          console.log(tabs);
    }, 1000);

  }
})

<v-tab-item v-for="i in 4" :key="i" :ref="'childTabsContent' + i">
  <div v-text="'A' + i"></div>
</v-tab-item>

Object.keys(this.$refs).forEach(el => {
  console.log( this.$refs[el][0] )
})