collapse-zhcn

This commit is contained in:
liumeo 2019-12-02 03:57:34 +08:00
parent f1fa652496
commit 7b298405aa
4 changed files with 77 additions and 0 deletions

View File

@ -0,0 +1,20 @@
# 手风琴
```html
<n-collapse v-model="activeNames" accordion>
<n-collapse-item title="动态类型" name="1">
<div>Python</div>
</n-collapse-item>
<n-collapse-item title="静态类型" name="2">
<div>Java</div>
</n-collapse-item>
</n-collapse>
```
```js
export default {
data() {
return {
activeNames: []
}
}
}
```

View File

@ -0,0 +1,23 @@
# 基础
```html
<n-collapse v-model="activeNames">
<n-collapse-item title="青铜" name="1">
<div>可以</div>
</n-collapse-item>
<n-collapse-item title="白银" name="2">
<div>很好</div>
</n-collapse-item>
<n-collapse-item title="黄金" name="3">
<div>真棒</div>
</n-collapse-item>
</n-collapse>
```
```js
export default {
data() {
return {
activeNames: []
}
}
}
```

View File

@ -0,0 +1,6 @@
# 折叠面板
```demo
basic
accordion
nested
```

View File

@ -0,0 +1,28 @@
# 嵌套
```html
<n-collapse v-model="activeNames">
<n-collapse-item title="绿灯" name="1">
<n-collapse v-model="activeNames2">
<n-collapse-item title="常亮" name="1">
<div>通过</div>
</n-collapse-item>
<n-collapse-item title="闪烁" name="2">
<div>快速通过</div>
</n-collapse-item>
</n-collapse>
</n-collapse-item>
<n-collapse-item title="红灯" name="2">
<div></div>
</n-collapse-item>
</n-collapse>
```
```js
export default {
data() {
return {
activeNames: [],
activeNames2: []
}
}
}
```