Javascript Vuetify扩展面板无法一次扩展一个

我正在尝试使用，但是在循环

v-expansion-panel

时，我无法一次只扩展一个。为什么它要扩大所有的扩张？我所做的唯一不同于文档的事情是循环

v-expansion-panel

，而不是

v-expansion-panel-content

。对我来说，它似乎从数组中获取第一个元素并将其用作状态

我试图实现的是，我想知道它们中的哪一个是开放的，但如果没有v-model，我不知道如何实现它

---

是我做的代码沙盒。感谢您的帮助。

所有5项都绑定到

面板的第一个元素

数组，这就是它们一起打开/关闭的原因

您需要将

v-model

绑定到不同的值：

<v-expansion-panel
     v-for="(item, i) in 5"
        :key="i"
      expand
      v-model="panel[i]">
    ....  
</v-expansion-panel>

---

或者您可以使用

v-expansion-panel-content

作为vuetify官方示例

所有5项都绑定到

panel

数组的第一个元素，这就是它们一起打开/关闭的原因

您需要将

v-model

绑定到不同的值：

<v-expansion-panel
     v-for="(item, i) in 5"
        :key="i"
      expand
      v-model="panel[i]">
    ....  
</v-expansion-panel>

---

或者您可以使用

v-expansion-panel-content

作为vuetify官方示例

我只是想帮助其他无法接受此线程方法的人，因为所有v-expansion-panel都是动态添加的，很难将v-expansion-panel的v-model保持在正确的状态

---

我发现v-expansion panel有beauty method.toggle（），它可能会帮助您解决问题

我只是想帮助其他无法接受此线程方法的人，因为所有v-expansion-panel都是动态添加的，而且很难将v-expansion-panel的v-model保持在正确的状态

---

我发现v-expansion panel有beauty method.toggle（），它可能会帮助您解决问题

当前您必须使用多重属性

<v-expansion-panels 
 v-model="panel" 
 multiple
 >

    <v-expansion-panel 
     v-for="(item,index) in items" 
     :key="index"
  >

---

目前，您必须使用多重属性

<v-expansion-panels 
 v-model="panel" 
 multiple
 >

    <v-expansion-panel 
     v-for="(item,index) in items" 
     :key="index"
  >

---

为什么面板是数组的数组？不管怎样，它工作得很好，谢谢。为什么面板是数组的数组？不管怎样，它工作得很好，谢谢你。