Vue 中的折疊列表是一個非常方便的功能，它可以讓用戶在點(diǎn)擊列表項(xiàng)時展開或者收起一個列表內(nèi)容。下面我們來看一個示例：

<template><div><ul><li v-for="(item, index) in items" :key="index" @click="toggle(index)">{{item.title}}
<div v-show="item.show">{{item.content}}
</div></li></ul></div></template><script>export default {
data() {
return {
items: [
{title: '標(biāo)題1', content: '內(nèi)容1', show: false},
{title: '標(biāo)題2', content: '內(nèi)容2', show: false},
{title: '標(biāo)題3', content: '內(nèi)容3', show: false}
]
}
},
methods: {
toggle(index) {
this.items[index].show = !this.items[index].show;
}
}
}
</script>

在上面的示例中，我們通過在 `li` 標(biāo)簽上綁定 `click` 事件，在點(diǎn)擊時調(diào)用 `toggle()` 方法，來切換列表項(xiàng)的 `show` 屬性。而在每個列表項(xiàng)的內(nèi)容部分我們使用了 `v-show` 指令來控制展示和隱藏。這樣，當(dāng)用戶點(diǎn)擊列表項(xiàng)時，對應(yīng)的內(nèi)容部分就會展開或者收起。

需要注意的是，我們在 `li` 標(biāo)簽上綁定了 `key` 屬性，這是為了在 Vue 的列表渲染中避免出現(xiàn)重復(fù)元素造成的性能問題。

另外，我們在 `