Accordion 手风琴

使用指南

在 page.json 中引入组件

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

视频演示

代码演示

  1. <w-pane title="Accordion" desc="手风琴" />
  3. <w-pane desc="Default" />
  5. <w-accordion-group bind:onChange="onChange" bind:disabledClick="disabledClick">
  7.     <w-accordion title="Wuss WeAPP 1" key="你好">
  8.         content 1
  9.     </w-accordion>
  10.     <w-accordion title="Wuss WeAPP 2" key="{{['你好']}}">
  11.         content 2
  12.     </w-accordion>
  13.     <w-accordion
  14.      disabled
  15.      title="Wuss WeAPP 3"
  16.      key="我是被禁用的"
  17.     />
  18.     <w-accordion title="Wuss WeAPP 4" key="{{{say:'你好'}}}">
  19.         content 4
  20.     </w-accordion>
  21. </w-accordion-group>
  23. <w-pane desc="Accordion = true" />
  25. <w-accordion-group
  26.  bind:onChange="onChange"
  27.  accordion
  28.  bind:disabledClick="disabledClick"
  29. >
  31.     <w-accordion title="Wuss WeAPP 1" key="你好">
  32.         content 1
  33.     </w-accordion>
  34.     <w-accordion title="Wuss WeAPP 2" key="{{['你好']}}">
  35.         content 2
  36.     </w-accordion>
  37.     <w-accordion
  38.      disabled
  39.      title="Wuss WeAPP 3"
  40.      key="我是被禁用的"
  41.     />
  42.     <w-accordion title="Wuss WeAPP 4" key="{{{say:'你好'}}}">
  43.         content 4
  44.     </w-accordion>
  45. </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根节点样式类