### 基本用法 ``` html {width: 31.8%} 水杯 坚果 毛巾 沙发 ``` ### 选项值 ``` html {width: 31.8%} 水杯 坚果 毛巾 沙发 ``` ### 只读、禁用、禁用某一项 ``` html 水杯 坚果 毛巾 沙发 水杯 坚果 毛巾 沙发 水杯 坚果 毛巾 沙发 ``` ### 分隔符 ``` html {width: 31.8%} 水杯 牙刷 坚果 毛巾 沙发 ``` ### 分组 ``` html

默认，无折叠功能

毛巾 牙刷 牙缸 水杯 筷子 碗

开启折叠功能

毛巾 牙刷 牙缸 水杯 筷子 碗

手风琴模式

毛巾 牙刷 牙缸 水杯 筷子 碗

触发方式：整行点击均可触发（默认）

毛巾 牙刷 牙缸 水杯

触发方式：仅点击小箭头时触发

毛巾 牙刷 牙缸 水杯 ``` ### 可取消 尝试在同一个选项上点击两次。 ``` html {width: 31.8%} 水杯 坚果 毛巾 沙发 ``` ### 多项选择 可以使用`v-model`或`:value.sync`两种方式进行双向绑定。 ``` vue {width: 31.8%} ``` #### 前端分页 ``` vue ``` #### 一次性后端数据，前端分页 在`data-source`属性中传入`load`方法，用于接收完整的后端数据。 `load`方法要求返回一个`Promise>`或`Promise<{ data: Array, total: Number }>`的格式。该会在组件初始化时会被调用一次，如果不需要可以将`initial-load`属性设置为`false`。 开启`pageable`属性时可以进行前端分页。 ``` vue ``` #### 多选时验证 ``` vue ``` #### loading ``` vue ``` ### 前端分页，数据源改变后分页问题 ``` vue ``` ### 后端分页，reload后分页问题 ``` vue ```