我在表格行内动态呈现 UIKit Accordion ,每个 Accordion 只包含一个子 (li
) 元素。我怎样才能同步这些 Accordion ,以便当其中一个打开时,其他 Accordion 折叠起来?就像选项 multiple: false
一样。这是一个 Vue 应用程序(如果您可以提供更具体的答案)。
最佳答案
这个答案更好,性能更高
i
是循环的索引。
prevAccordionIndex
在 Vue 实例数据中定义,初始设置为 null。它用于保存之前(最后)打开的 Accordion 的索引,因此无需像之前的答案那样遍历 $refs
来查找打开的 Accordion 。
所有 Accordion 最初都是折叠的(关闭的)。
methods: {
handleAccordionShow(index) {
if (this.prevAccordionIndex !== null) {
this.$uikit.accordion(this.$refs.categoryAccordion[this.prevAccordionIndex]).toggle(0, false)
this.prevAccordionIndex = index
} else {
this.prevAccordionIndex = index
}
},
handleAccordionHide(index) {
this.prevAccordionIndex = this.prevAccordionIndex === index ? null : index
}
}
<ul ref="categoryAccordion" @beforeshow="handleAccordionShow(i)" @beforehide="handleAccordionHide(i)" uk-accordion>
<li>...</li>
</ul>
关于javascript - 如何同步多个 UIKit Accordion ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54967832/