Accordion 手风琴

使用指南

在 page.json 中引入组件

  1. "usingComponents": {
  2. "w-accordion": "wuss-weapp/w-accordion/index",
  3. }

视频演示

代码演示

  1. <w-pane title="Accordion" desc="手风琴" />
  2. <w-pane desc="Default" />
  3. <w-accordion-group bind:onChange="onChange" bind:disabledClick="disabledClick">
  4. <w-accordion title="Wuss WeAPP 1" key="你好">
  5. content 1
  6. </w-accordion>
  7. <w-accordion title="Wuss WeAPP 2" key="{{['你好']}}">
  8. content 2
  9. </w-accordion>
  10. <w-accordion
  11. disabled
  12. title="Wuss WeAPP 3"
  13. key="我是被禁用的"
  14. />
  15. <w-accordion title="Wuss WeAPP 4" key="{{{say:'你好'}}}">
  16. content 4
  17. </w-accordion>
  18. </w-accordion-group>
  19. <w-pane desc="Accordion = true" />
  20. <w-accordion-group
  21. bind:onChange="onChange"
  22. accordion
  23. bind:disabledClick="disabledClick"
  24. >
  25. <w-accordion title="Wuss WeAPP 1" key="你好">
  26. content 1
  27. </w-accordion>
  28. <w-accordion title="Wuss WeAPP 2" key="{{['你好']}}">
  29. content 2
  30. </w-accordion>
  31. <w-accordion
  32. disabled
  33. title="Wuss WeAPP 3"
  34. key="我是被禁用的"
  35. />
  36. <w-accordion title="Wuss WeAPP 4" key="{{{say:'你好'}}}">
  37. content 4
  38. </w-accordion>
  39. </w-accordion-group>
  1. onChange(e) {
  2. console.log(e.detail);
  3. },
  4. disabledClick(e) {
  5. console.log(e.detail);
  6. },

API

Attribute 属性

属性说明类型默认值
key携带的数据stringnull
title标题string-
disabled是否开启禁用boolean-

Event 事件

事件名说明参数

Slot 插槽

名称说明

Class 自定义类名

类名说明
wuss-class根节点样式类