# Collapse 折叠

import { collapse, collapseItem } from 'vigour';
// collapse.name === 'vigour-collapse'
// collapseItem.name === 'vigour-collapse-item'

# Example

# Basic

By default, vigour-collapse can display multiple vigour-collapse-items at the same time.

默认情况下,vigour-collapse 可以同时显示多个 vigour-collapse-item

title 1
content 1
title 2
content 2
title 3
[ "title 1", "title 2" ]
<vigour-collapse v-model="unfold2">
  <vigour-collapse-item title="title 1">content 1</vigour-collapse-item>
  <vigour-collapse-item title="title 2">content 2</vigour-collapse-item>
  <vigour-collapse-item title="title 3">content 3</vigour-collapse-item>
</vigour-collapse>
<blockquote>
  {{ unfold2 }}
</blockquote>
export default {
  data() {
    return {
      unfold2: ['title 1', 'title 2'],
    }
  }
}

# Single

The single attribute enables vigour-collapse to display only one vigour-collapse-item at a time.

single 属性可以使 vigour-collapse 一次只能显示一个 vigour-collapse-item

title 1
content 1
title 2
title 3
[ "title 1" ]
<vigour-collapse v-model="unfold" single>
  <vigour-collapse-item title="title 1">content 1</vigour-collapse-item>
  <vigour-collapse-item title="title 2">content 2</vigour-collapse-item>
  <vigour-collapse-item title="title 3">content 3</vigour-collapse-item>
</vigour-collapse>
<blockquote>
  {{ unfold }}
</blockquote>
export default {
  data() {
    return {
      unfold: ['title 1'],
    }
  }
}

# Props

# vigour-collapse

prop type default value available value
v-model array<string> - -
single boolean false -

# vigour-collapse-item

prop type default value available value
title string - -